# Background Image NOT displaying

**URL:** https://forum.kirupa.com/t/background-image-not-displaying/163789
**Category:** web dev
**Created:** [September 26, 2005, 10:22am UTC](https://forum.kirupa.com/t/background-image-not-displaying/163789 "2005-09-26T10:22:12Z")
**Posts on this page:** 1
**Page:** 1

<div class="post-metadata">

### Author: ![DESIGN\_GEEZER](https://avatars.discourse-cdn.com/v4/letter/d/da6949/32.png) [@DESIGN\_GEEZER](https://forum.kirupa.com/u/DESIGN_GEEZER)
#### Post date: [September 26, 2005, 10:22am UTC](https://forum.kirupa.com/t/background-image-not-displaying/163789/1 "2005-09-26T10:22:12Z")

</div>

Hi all,

my CSS layout is going great apart from one thing.

I have a main container for 3 divs which us floats to lay them out correctly. My 3 divs do not have any background colours or background images of their own. The main container does have a background image. Why isn’t it showing through on FIREFOX but is working ok on IE?! Grr!! Please help…

MY CSS STYLE

```auto

div#siteWrap {
padding: 0px;
height: 43px;
width: 700px;
margin-top: 0px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
background-color: #FFFFFF;
}
div#header {
margin: 0px;
padding: 0px;
height: 46px;
width: 700px;
}
div#mainWrapper {
margin: 0px;
padding: 0px;
width: 700px;
background: url("body_bg.gif") repeat-y left top;
}
div#mainContent {
margin: 0px 3px 0px 0px;
padding: 0px;
width: 354px;
float: left;
font-family: "Trebuchet MS", Arial, Verdana;
font-size: 0.7em;
line-height: 1.8em;
color: #000000;
}
div#mainImage {
margin: 0px;
padding: 0px;
width: 140px;
float: left;
}
div#mainNavigation {
width: 200px;
margin: 0px 0px 0px 3px;
padding: 0px;
float: right;
}

```

MY HTML MARKUP

```auto

<div id="siteWrap">
<div id="header">my header</div>
<div id="mainWrapper">
<div id="mainContent">
<p>content blah blah blah</p>
</div>
<div id="mainImage">
<p>my image</p>
</div>
<div id="mainNavigation">
<p>navigation</p>
	 </div>
</div>
</div>

```

See attached body background image. Thanks