Welcome to WebmasterWorld Guest from 107.22.14.254

Forum Moderators: not2easy

Message Too Old, No Replies

Left div doesn't stretch 100%

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

5+ Year Member



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

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

5+ Year Member



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.

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

WebmasterWorld Senior Member 10+ Year Member



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>

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

WebmasterWorld Senior Member 10+ Year Member




Do a search for 'faux columns'. That should help you with this problem.
2:47 pm on Aug 12, 2007 (gmt 0)

5+ Year Member



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

 

Featured Threads

Hot Threads This Week

Hot Threads This Month