# IE - div container 1px margin

**URL:** <https://forum.kirupa.com/t/ie-div-container-1px-margin/202506>\
**Category:** web dev\
**Created:** [October 2, 2006, 9:46am UTC](https://forum.kirupa.com/t/ie-div-container-1px-margin/202506 "2006-10-02T09:46:37Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![dirksmith](https://avatars.discourse-cdn.com/v4/letter/d/47e85d/32.png) [@dirksmith](https://forum.kirupa.com/u/dirksmith)\
**Post date:** [October 2, 2006, 9:46am UTC](https://forum.kirupa.com/t/ie-div-container-1px-margin/202506/1 "2006-10-02T09:46:37Z")

</div>

Hi

I’m having a problem with a 1px left border appearing on an inner layout div container – predictably this happens in IE (but not FF).

The CSS is below. You will see that I have the main div (#container\_main\_shadow) holding an inner content div (#container\_main\_sub).

You can see this here:  
[http://www.walkertest.co.uk/condor/w01540\_condor\_web/test.html](http://www.walkertest.co.uk/condor/w01540_condor_web/test.html)

The inner content div (#container\_main\_sub) appears to be causing the problem in IE.

My 1 idea on a fix at the moment is an issue with the width of container\_main\_shadow background image (1024px) and the width of the inner container (995px) – with these both centred the left/right space is 29px / 2 = 14.5 px. Which I guess may be problematical for IE.

But before playing around with this some more – does anyone have an ideas on a css IE fix?

Grateful for any help

Thanks

Dirk

p {margin: 15px 0px 0px 0px}

body {

background-image: url(graphics/bg\_main.gif);  
margin:0px;  
margin-top:0px;  
margin-right:0px;  
margin-bottom:0px;  
padding:0px;  
border:0px;

}

#container\_main\_shadow{  
position:relative;  
background-image: url(graphics/bg\_strip\_gradient.jpg);  
top:auto;  
left:0px;  
width:1024px;  
height:auto;  
background-color:#FFFFFF;  
padding:0px;  
margin: auto;  
}

#container\_main\_sub{  
position:relative;  
top:0px;  
width:995px;  
height:1200px;  
background-color:#FFFFFF;  
margin:auto;  
padding:0px;  
}

#container\_shadow\_bottom{  
position:relative;  
background-image: url(graphics/bg\_strip\_gradient\_bottom.jpg);  
background-repeat: bottom left no-repeat;  
left:0px;  
top: auto;  
width:1024px;  
height:25px;  
margin: auto;  
padding:0px;

}
