homepage Welcome to WebmasterWorld Guest from 54.196.77.82
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Become a Pro Member
Home / Forums Index / Code, Content, and Presentation / CSS
Forum Library, Charter, Moderator: open

CSS Forum

    
Left div doesn't stretch 100%
moesian




msg:3419711
 5:11 pm on Aug 11, 2007 (gmt 0)

Hi,

I've got a problem with the following code:

<div style="border:thin solid #33FF33;" >

<div style="float:left; display:inline; width:7px; border:thin solid #33FF33; height:100%; display:block;"></div>
<div style="margin-left:7px; border:thin solid #9999FF;"<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p>
</div>
</div>

Inside the main div are two divs one containing text and one to the left of it, I want the div on the left to stretch to the height of the div containing the text, it's driving me crazy.

Any help would be much appreciated.

Thanks

 

SixTimesEight




msg:3419718
 5:33 pm on Aug 11, 2007 (gmt 0)

I don't think there is a way to do that.

I usually cope with this be creating the appearance of a column by using a vertically repeating background image that spans across both columns.

Marshall




msg:3419728
 5:49 pm on Aug 11, 2007 (gmt 0)

Not sure what you're trying to achieve, but this may come close:

<div style="border:thin solid #3F3;" >

<div style="margin-left: 7px;border-left:thin solid #3F3;">
<div style="margin-left:1px; border:thin solid #99F; padding: 5px;"><p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p>
</div>
</div>
</div>

marcel




msg:3420052
 7:59 am on Aug 12, 2007 (gmt 0)


Do a search for 'faux columns'. That should help you with this problem.

moesian




msg:3420154
 2:47 pm on Aug 12, 2007 (gmt 0)

Hi,

Thanks for the help got this one cracked using something similar to whar Marshall proposed. Just got a few problems in IE6 with backgrounds, hopefully will solve this soon.

Cheers

Global Options:
 top home search open messages active posts  
 

Home / Forums Index / Code, Content, and Presentation / CSS
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved