Div behaviour in IE vs Firefox... strange spacing

Question

http://www.bnimarionbusinessbuilders.com/test2.html
I am just working on the structure at this point, but there
is an odd bit of space added at the very top of the left column
(before the burgundy bar) in Internet Explorer. It renders
perfectly in Firefox, and looks perfect in Dreamweaver. I have
tried EVERYTHING to make that gap go away. I've adjusted margins,
padding, looked for stray spaces in the coding, but nothing.
Hopefully some of you may have an idea as to how to make this
go away! Thank you in advance.
~Laura, Laipply's Quickprint
http://www.laipplyqprint.com

Answer 1

LaipplysQuickprint wrote:
>
http://www.bnimarionbusinessbuilders.com/test2.html
>
> I am just working on the structure at this point, but
there is an odd bit of
> space added at the very top of the left column (before
the burgundy bar) in
> Internet Explorer. It renders perfectly in Firefox, and
looks perfect in
> Dreamweaver. I have tried EVERYTHING to make that gap go
away. I've adjusted
> margins, padding, looked for stray spaces in the coding,
but nothing.
>
> Hopefully some of you may have an idea as to how to make
this go away! Thank
> you in advance.
>
> ~Laura, Laipply's Quickprint
>
http://www.laipplyqprint.com
>
Hi,
Change the CC in the head of the doc - replace yours for
mine....
<!--[if IE]>
<style type="text/css">
/* place css fixes for all versions of IE in this conditional
comment */
.twoColLiqRtHdr #mainContent { zoom: 1; }
/* the above proprietary zoom property gives IE the hasLayout
it needs
to avoid several bugs */
</style>
<![endif]-->
In your stylesheet - find this.....
.twoColLiqRtHdr #topbar {
background-color: #68121F;
Replace with.....
.topbar {
background-color: #68121F;
height: 7px;
Now in your HTML markup find each instance of where you would
like to
use this, for example...
<div id="topbar">
<img src="spacer.gif" height="7" width="1">
</div>
and replace with this.....
<div class="topbar">
</div>
HTH
chin chin
Sinclair