Terry O'Leary wrote:
Hi
I've been working on my company site www.arcolectric.co.uk/index2.html
and have designed it in pure CSS.
I have a background img assigned to the body element with a slight
fade, and a div that contains a background image of the menu bar along
the top, i need the background of the menu bar to line up to the
bodies background.
I've discovered that i have a problem with the mast head being
rendered differently in different browsers. On windows in IE the page
displays perfectly, but in firefox/safari on a mac a top margin of
around 7px appears in the div with the menu bar and so pushes the
alignment of the backgrounds out.
I currently have the following CSS for the menu and the body:
#banner_Distribution{
margin:auto;
margin-top:0px;
width:800px;
height:90px;
padding:0px;
padding-right:2px;
background:url(_images/banner_bg_agents.jpg) 0px 0px no-repeat;
}
body{
margin:0px 0px;
width:100%;
background:url(_images/main_body_bg.jpg) 0px -18px repeat-x;
padding:0px;
}
any one have any ideas, i've noticed if i surround the menu bar with a
border the problem fixes itself and have tried various solutions to no
avail HELP!
Terry,
The page appears identical to me in IE and FF. Did you fix it?
However, I have a few suggestions for you.
1. If adding a border fixes a gap, you probably have margin collapsing
going on. Please read the resources on this page:
http://css-discuss.incutio.com/?page=CollapsingMargin
2. Always develop for a good browser like Firefox, Opera, or Safari
first, then worry about IE. 99% of the time, when something looks
perfect in IE and messed up in the others, it is IE that has it wrong
and the others who have it right. You'll spend a lot less time
developing and testing if you build for the standards and then tweak for
IE, since there is usually no way to make good browsers imitate IE's
random and perplexing bugs.
3. Validate your markup and CSS as a first step in debugging. Fixing
your markup will often fix the rendering issues that you see. If it
doesn't, at least you have valid markup now, and you can then move on to
asking for help from a list such as this.
Best,
Zoe
--
Zoe M. Gillenwater
Design Services Manager
UNC Highway Safety Research Center
http://www.hsrc.unc.edu
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
