carrieduncan
Member
Posted 2 years ago #
Not sure that's really what's happening, but it sure looks like it. 4px white top border for the menu in CSS; fine in FF but IE, not so much. Margin and padding in all rules set to 0px.
http://0055ae0.netsolhost.com/wordpressLR/?page_id=12
I'll post style sheet if this is not enough info.
Thanks so much for any help you can give.
vangrog
Member
Posted 2 years ago #
You are using IE7, right? IE7 has issues with thin borders. It doesnt happen on IE8.
Cheers
carrieduncan
Member
Posted 2 years ago #
Sadly, I haven't even started testing IE7; this is IE8.
vangrog
Member
Posted 2 years ago #
Well, I can tell ya to me it looks OK. I get the same size border on your page, with both Firefox and IE8.
henkholland
Member
Posted 2 years ago #
In IE7 it's about twice the height compared to Firefox.
I noticed that 4 of your other stylesheets are not found, like this one wordpressLR/wp-content/themes/LR/styles/reset.css
Only style.css is found.
So it's hard to tell what causes it.
See here: http://jigsaw.w3.org/css-validator/
carrieduncan
Member
Posted 2 years ago #
Thanks, henkholland -- deleted those extraneous stylesheets, and remaining errors relate to Event Calendar 7. Also upgraded to current 2.9.1. Still stuck.
I took out my defined border altogether to isolate the problem; I set padding, margins, and rules to 0px for both the masthead and the menu bar and still I see that small white gap.
Does anyone else have an idea?
Access Forbidden
Access denied. Please click on the back button to return to the former page.
http://0055ae0.netsolhost.com/wordpressLR/?page_id=12
carrieduncan
Member
Posted 2 years ago #
So sorry, back and forth between sites, settled here:
http://www.carrieduncandesign.com/wordpress/
Thanks so much --
I can only see this effect if I use IE8 in Compatibility mode (which generally represents what you'd see in IE7). You have one validation error (an extra closing </div> just before </body> that simply needs removing) and 1 CSS error (parse error in line 240 of LR/style.css).
None of the above should cause the gap in IE7, so I think it's simply down to IE7's faulty CSS box model. The best and easiest option would be to target a very short conditional sheet at IE7 or below. Could be something as easy as:
#menu {
position:relative;
top:-4px;
}
in the conditional sheet.
carrieduncan
Member
Posted 2 years ago #
Many thanks, esmi — I'll try that. Thanks also for the link.
carrieduncan
Member
Posted 2 years ago #
This worked perfectly, esmi — thanks so much.