[css-d] Gap between divs in IE6

[Paul Jinks]

I've been trying to fix this till I can't remember my own name:

I have a page that looks just as I want in FF but which misbehaves in IE6,
showing a gap between divs.
Link: http://www.pauljinks.co.uk/test/contentTemplate2.html

I've stripped down everything to identify the offending code, which looks
like this:

<div id="container">
    <div id="main-top"></div>
    <div id="objective"></div>
    <div id="objectiveBot"></div>
</div>

The  idea is that the content of #objective appears in a nice rectangle
with rounded corners, the top and bottom of said rectangle being contained
by #main-top and #objectiveBot.

here's my css:

body {
        margin: 0px;
        padding: 0px;
        }

#container {
        width: 770px;
        margin: auto;
        }

#main-top {
        height: 16px;
        width: 770px;
        background-image: url(..);
        background-repeat: no-repeat;
        }

#container #objectiveBot {
        background-image: url(..);
        background-repeat: no-repeat;
        width: 770px;
        height: 23px;
        }

#container #objective {
        background-image: url(...);
        background-repeat: repeat-y;
        width: 770px;
        }
I know it's something pretty obvious, but I can't see the wood for the
wotsits here.

Please help.

Paul

______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/