Problem with my background in css [Archive]

View Full Version : Problem with my background in css

jeddi

04-15-2008, 04:46 PM

Hi

I have been struggling with a css problem and can not see why it is not working :o

In the css I have this:

/* Header */

#header {
width: 900px;
margin: 0 auto;
background:transparent;
}

/* Main */

#main {
width: 900px;
margin: 0 auto;
background:#fff;
border:#ddd 3px solid;
}

And in my HTML I have this:

<body>

<div id="header">

<div id="splash"></div>

<div id="logo">
<div id="menu">
<ul>
<li><a href="/index.php">Home</a></li>
<li><a href="/some.php" >Somewhere</a></li>
</ul>
</div> 
</div> 

<div id="main">


<div class="ad_man">
<div class="xsnazzy" style ="width: 110px;" >
<b class="xtop"><b class="xb1"></b><b class="xb2 xcolor"></b><b class="xb3 xcolor"></b><b class="xb4 xcolor"></b></b>
<div class="xboxcontent">
<h4 class="xcolor" >Ad Manager</h4>
<p style='font-size:12px;text-align:center; font-weight:bold;'><a href="<?php echo $ad_manager_add_link ?>">Place an advert</a></p>
<p style='font-size:13px;text-align:center; font-weight:bold;'><a href="<?php echo $ad_manager_edit_link ?>">Edit advert</a></p>
</div>
<b class="xbottom"><b class="xb4"></b><b class="xb3"></b><b class="xb2"></b><b class="xb1"></b></b>
</div>
</div> 

The full source code is not long and can be seen at http://fethiye-guide.com/ez-ads/index.php

Now the  section should be
nested with in the <div id="main"> and therefore
should have a white background and a grey border.

For some reason this isn't happening !
The grey box appears to start and end with nothing inside it.

Does anyone know what I've done wrong ?

Thanks

jcdevelopment

04-15-2008, 05:00 PM

it may be the fact that everything is wrapped in the header div, try ending that div before the content and see what happens!

effpeetee

04-15-2008, 05:27 PM

http://exitfegs.co.uk/testa.html

Is this how it should look.

Frank

jeddi

04-15-2008, 07:33 PM

Is this how it should look ?

No - if you click on the "HOME" tab you will see how it should look.
The thick grey line underneath the tabs should be a rectangle with a White background - like you see on my blog HOME page

Thanks for looking - hope you can help me solve this :)

effpeetee

04-15-2008, 09:44 PM

I can't see any difference except for the content.
What browser are you using and what screen resolution.

Mine IE7 and 1024x728

Frank

effpeetee

04-15-2008, 09:51 PM

Screenshots.

Frank

Back in the morning.

ZZZZZZzzzzzzzz!!!!

jeddi

04-16-2008, 08:53 AM

Thanks again for looking into this especially with the screen dumps ( thats pretty professional :) )

Anyway, I am using Moz FF and with that my Home (blog) page has the white background but the http://fethiye-guide.com/ez-ads/index.php page does not.

Can you see any reason in the source code why Moz FF would not have the white bg ?

thanks again. :thumbsup:

jeddi

04-16-2008, 09:06 AM

I have "forced" the box open with a height statement.

So in the css I now have:

#main {
width: 900px;
height:1080px;
margin: 0 auto;
background:#fff;
border:#ddd 3px solid;
}

But this should not be neccessary because the other divs are nested inside the main div.

I must have got something wrong somewhere:(

effpeetee

04-16-2008, 09:50 AM

Remove this background color and it all goes white using FireFox. At least it does for me
If you need it for another part of the site, you could use an inline css div on the actual page concerned.
Frank

body {
background-color: #006599;
}

jeddi

04-18-2008, 05:49 PM

Thanks for replying effpeetee ...

but you've lost me !

I don't have a

body {
background-color: #006599;
}

anywhere in my code - do I ?

thanks - please point out an errors - I am trying to get better ;)