Jump to content

colour display issue using IE6 and Opera


zaniac
 Share

Recommended Posts

I thought I had it all and I thought I knew it all, but sadly no. Like a rabbit staring into the lights of an oncoming car BANG!!! reality hits me and knocks me for six :)OK my problem is probably something that can quite easily be solved. I have almost finished my first web page, but I am having a problem with the positioning of background colour at the top of the screen. I am trying to get a <div> to display a plain coloured background in the very top-left corner of the screen and extending all the way across to the other side. Currently, I can get the coloured background to display, but there is the general white body background all around it and it's the left, top and right sides which I need to hide (if that makes sense). (XHTML)<body><div id="home"><a href="index.html" ></a></div>----------------------------------------------------------- (CSS)body {font-family: Lucida Sans, Arial, Verdana; font-size: 12px;}#home { background-color: #C43F42; background-repeat: repeat-x; width: 100%; height: 120px; margin: 0px 0px 0px 0px; padding: 0px;} #home a{background-image: url(../../h2wgraphics/logo3.gif); float: left; padding: 0px 0px 0px; margin: 0px 0px 0px 150px; clear: right; }IE6 and Opera are the two browsers I am using for compatibilty checks.I know you guys have helped me before and once again your help is seriously appreciated :)

Link to comment
Share on other sites

Something I found quite useful is to set everything to zero:

* {margin:0;padding:0}

You may have to go back and adjust your home id. By doing that you can also remove all of the 0px 0px 0px 0px stuff.That should carry across all browsers and get rid of the padding/margin in IE.

Link to comment
Share on other sites

Hi S@m thanks for your reply. I tried what you suggested, to reset everything. For some reason when ever I add the the home <div> to the top of the web page, all browsers seen to surround in in the plain white body background colour. I'm sure I have not had this problem before.For now I have just used the colour background for the <body>, but if anyone else has any ideas, then please please please let me know :)Thanks in advance :)

Link to comment
Share on other sites

hit the:'Print Screen'button, above the Insert Key, and left of the Scroll lock key.This will add a picture of the screen at the time to the 'Clip Board'.I hope this is what you ment!

Link to comment
Share on other sites

firstly try:body {margin:0; padding: 0; font-family: Lucida Sans, Arial, Verdana; font-size: 12px;}secondly your css is odd you have "background-image" defined in "#home a" but "background-repeat: repeat-x;" in "#home" that makes no sense do you want the background image on the div or on the link?

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...