# A complex problem - XHTML,CSS

**URL:** <https://forum.kirupa.com/t/a-complex-problem-xhtml-css/229797>\
**Category:** web dev\
**Created:** [June 20, 2007, 9:21am UTC](https://forum.kirupa.com/t/a-complex-problem-xhtml-css/229797 "2007-06-20T09:21:09Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![Abus](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/abus/32/930_2.png) [@Abus](https://forum.kirupa.com/u/Abus)\
**Post date:** [June 20, 2007, 9:21am UTC](https://forum.kirupa.com/t/a-complex-problem-xhtml-css/229797/1 "2007-06-20T09:21:09Z")

</div>

Hi,

I have a main image for the header part of the page. But this image has different colors on its left and right sides. So I need to use 2 background images instead of 1.

(For a better understanding you can check this picture  
[www.abus.terzzi.com/sample.jpg](http://www.abus.terzzi.com/sample.jpg)  
)

So I made 2 divs for the 2 different background,

\<div id=“backgroundLeft” \>\</div\>  
\<div id=“backgroundRight” \>\</div\>

```auto

#backgroundRight {
    position:fixed;
    z-index:1;
    width:49.9%;
    height:315px;
    float:right;
    margin-left:50%;
    background-position:left top;
    background-repeat:repeat-x;
    background-image:('bgRight.jpg')
}

#backgroundLeft {
    position:fixed;
    z-index:1;
    width:50%;
    height:315px;
    float:left;
    background-position:right top;
    background-repeat:repeat-x;
    background-image:('bgLeft.jpg')
}

```

And 1 div for the main image

 ![]()

```auto

#mainPicture {
    position:absolute;
    z-index:5;
    width:100%;
    text-align:center
}

```

This structure looks good on FireFox but it goes bad at IE 6.0  
you can check it at: [www.abus.terzzi.com](http://www.abus.terzzi.com) .

My questions are can you suggest a better structure and how can I make this work on IE6.

This is a very urgent issue, I hope you can help.

Best Regards