[css-d] FF MSIE background image problem
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!
--
Regards
Terry O'Leary
Web Developer @ The Elektron Group
~Online dating community ? www.d8-m8.com
__
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/
Re: [css-d] FF MSIE background image problem
Terry O'Leary wrote: www.arcolectric.co.uk/index2.html 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. 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! You are describing /one way/ to solve 'collapsing margins'[1], although I can't see the problem at my end and can't recommend which of the many fixes to use. Apart from that, you have triggered the 'em font-resizing bug'[2] in IE/win. Your layout is also clearly not prepared for any degree of font-resizing in any browser, and those menu-links get pushed out of alignment. regards Georg [1]http://www.w3.org/TR/CSS21/box.html#collapsing-margins [2]http://www.gunlaug.no/contents/wd_additions_13.html -- http://www.gunlaug.no __ 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/
