Hi all, I hav an issue with float element while using IE8/earlier. I use Display:inline in CSS but still hav double margin issue while foating the element. I put the codes, pls help me to remove the extra spaces/unwanted spaces.
#logophoto{
float:left;
margin-left:30px;
margin-top:1px
} #h_menu{
float:right;
margin: 20px 3px 0 0;
padding:0;
border: solid red 1px;
} #h_menu ul{
list-style-type:none;
margin:0;
padding:3px;
} #h_menu li{
display:inline;
} #header#h_menu li a {
list-style-type:none;
text-align:center;
font-weight: bold;
color:#333;
font-size:11px;
}
I hav put border red in h_menu to see the problem, u can find a small box on right side of h_menu box. I dont knw how it come that bug, pls help me to rectify this bug??? if possible, pls also tell me the reason why??
You will also want to put widths on those floats. While it’s no longer required by the CSS specs to put widths on floats, IE (esp IE6) can still have issues with widthless floats. These widths can be in % if you want.
*edit also, we cannot see if you have a full and proper doctype. Without a complete doctype, IE (even IE8) will go into Quirks Mode, and assume your page was built in the heady days of grunge bands and the Internet bubble. Enough people don’t have doctypes that we cannot assume there is one. If you don’t have one, this could also be a source of strange display in all IEs for you.
The problem is, while i was trying to float a div right which is meant for a horizontal top menu, a space is there b/w right edge of wrapper and that div, I hav run this in IE 8, I hav put the width for that div & u can clear see what is the problem is. But in Mozilla, it is fine, no problem is there. Any help !!!
Great, though. This is good: whenever you run into a bug, first run your code through the validator to catch silly things like typos and unclosed tags…
Even I forget to do this before bug-hunting, but if a typo is the cause, it will always save you hair. I’ve lost a lot of hair, but you can still keep yours if you start on this path early : )