Home/ Questions/Q 944051
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-15T22:31:49+00:00

not sure why this isn’t working– i have 3 divs where the two on

  • 0

not sure why this isn’t working– i have 3 divs where the two on the side are empty, and all my content in the middle. IE6 is apparently ignoring the empty divs, as the content is pushed to the left. Any ideas what the problem could be?

.sidebar {
float: left;
width: 25%;
height:auto;
visibility:hidden;
font-size:1px;
line-height:0;
}

.main {
width: 50%;
height:auto;
float:left;
}
<div class="sidebar"><p> </p></div>
<div class="main">
...
</div>
<div class="sidebar"><p> </p></div>

I’ve tried putting empty comments instead of empty paragraphs in the divs, tried putting   in the divs, anything the internet said to do, to no luck. let me know if you want to see the content in the main.

Thanks!

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    I believe this is a situation where if the divs on the side are going to remain empty, you’ll have to specify height or at least a min-height to make it show up. Alternately, again if they’re going to remain empty, you could simply remove them and use margin: 0 auto 0 auto to center your middle column. IE6 in particular has some issues with non-breaking spaces that can cause all sorts of weird things to happen, but only in certain specific versions of IE6. Ahh, the joys of browsers.

    Note that height:auto won’t stretch anything if it doesn’t know what to stretch to, just like height: 100% won’t work without a div of known size to 100% to. From your question it doesn’t seem like you’re trying to stretch it to fill the screen, but it’s something to be aware of.

    A css framework such as 960.gs, YUI grids, or Blueprint would make this a cakewalk…I’m just sayin’

    • 0