David, Thanks for your valuable help. I cleaned up some extra html
tags as suggested by Woody and added the overflow: auto & *zoom:1; &
the page layout is much improved. best wishes, Leslie
On May 11, 2012, at 9:29 PM, David Hucklesby wrote:
On 5/11/12 5:47 PM, Leslie Albuquerque wrote:
Hello, Will you explain why the div "main" won't clear the sb divs
float
right and sit on its left side. Thank you or any help you can
provide.
http://www.cwl-host.com/shop/index.php
Umm. The div#main *is* clearing the float, which is why it appears
underneath. If you delete the "clear:both;" declaration on it, I
think you'll get the effect you seek.
I suggest you take the width off the rule for #main as well. When
you add in the extra padding and margin, it would be too wide to
fit, except for the fact that the box (not the text) slides under
the float.
Instead, you could let #main just take up remaining space. In order
to prevent the #main content from wrapping below the sidebar when
text size is increased, or more content is added, simply add any
declaration that creates a new block formatting context. Any one of
these should do:
overflow: auto;
overflow: hidden;
display: table-cell;
The equivalent for IE 6 and 7 -
zoom: 1;
So now you have:
#main {
background-color: #FFC003;
margin-left: 1em;
padding: .5em;
overflow: auto;
*zoom: 1;
}
HTH
--
Cordially,
David
______________________________________________________________________
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
______________________________________________________________________
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
