Member Avatar for sagive

Hey guys..

i got this kind of div structure
(Hebrew website)

<div id="main" style="background: #ffffff; padding: 20px;">

 <div id="sidebar" style="float: right;">
 actuall sidebar
 </div>

 <div id="pagecontent" style="float: right">
 some content
 </div>

</div>

My problem..

The contact inside the content / sidebar isn't stretching the "main" div and so.. i got no background for the other div's when the content is long..

This is a Wordpress based website so the content of each page is different
on each page.. also.. i dont want to use table.. <-- old system?

Got any idea's??
what am i missing?

i need to make the "main div" auto height that also works in IE
But leave those div's float side by side..

Your help would be appreciated

Edited by sagive because: added some info
  • 2 Contributors
  • 2 Replies
  • 190 Views
  • 20 Hours Discussion Span
  • Latest Post Latest Post by sagive
Member Avatar for chudapati09

Put this after #pagecontent

<div style="clear:both"></div>

Here's a good article talking about floats, http://www.alistapart.com/articles/css-floats-101/

So your code should look like this:

<div id="main" style="background: #ffffff; padding: 20px;">
     
    <div id="sidebar" style="float: right;">
    actual sidebar</div>
     
    <div id="pagecontent" style="float: right">
    some content</div>

    <div style="clear:both"></div>
     
</div>
Edited by chudapati09 because: n/a
commented: Thanks a lot :) +2
Member Avatar for sagive

Thanks a lot man.. i can't belive i haven't tried this :)

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.