hi, i am trying to bulletproof my site and use the dan cederholm 2 faux column technique but, it seems to work in FF but not IE. i've just about ready to give up. ive reviewed the code umteem times and i dont see the error. if you have a look at http://www.consciouscommunity.ca/ you'll see that the column starts over the header in ie. if you rollover the header, the header gets refreshed the column will start below the header. something is not right.
You haven't cleared your
You haven't cleared your floats properly. Take a look at Gary's article on the subject.
floats are clear
Hi, thanks for the info. its almost like the will not work with IE but that can't be right. i'm not sure how to fix the problem. i have cleared my float in the footer but still, it looks like ie doesnt always repeat my bg image or in the cast of the header, it put the gb img in the foreground. ive change the header img to have a solid white bg which results in the wrapper img (faux cols) going to the background. i'll review the artical again to see if i missed something. maybe there is a ie hack required, if so you would think it would be in the instructions. http://www.alistapart.com/articles/fauxcolumns/
I put <br style="clear:
I put <br style="clear: both;">
just above your footer and it seemed to solve the problem.
thats really strange but it
thats really strange but it seems to be working. i'm pretty sure i "clear: both;" in the #footer CSS code but it did not help. i've add the
to the html just about the footer div and now i can continue customizing the pages. cheers. (ps, i'm sure the light will come on in a few days.).
Yes, you did have clear:
Yes, you did have clear: both in your footer but sometimes that's not always enough and an additional element just before the end of the container with the floats is required.
Hi, Ive seemed to of gone
Hi, Ive seemed to of gone full circle. even with the extra clear statement, im getting weird results. by the time you read this, things will have changed. i will continue to (re)build the site and hopfully get the faux-cols working. faux cols problem site any assistance is welcomed.
Do this: body {
Do this:
body { color:#000000; } #wrapper { overflow: hidden; display: inline-block; background: url(/images/twocolBG.gif) repeat-y 20% 0;} max-width: 1200px; margin: 0 auto; } #wrapper { display: block; }
cheers,
gary
better
hi, im using your code but still have issues in IE just on some of the pages...investigating.
Things are looking much better but...ive noticed that under IE the liquid layout for page Directories isnt liquid but looks and acts liquid with FF. The leftnav div is set for 20% and the entry div is set for 80%. when i squish up the window under IE the div moved to the left. any thoughts ?
From #entry, #mission,
From #entry, #mission, remove {float:right; width:80%;} and add {margin-left: 20%;}.
From .drop, remove {clear: both;}.
cheers,
gary