[css-d] Problem aligning the tops of the side navigation and the main content

[Josue Martinez]

I managed to align the side navigation and main content along a
horizontal line in Firefox. However, in IE6 Win the alignment is
broken.
I guess it's because the side navigation is closer to the top in
Firefox (and I don't know why). I should mention that I used more divs
than I thought I would need precisely so I could position everything
with pixel-precision. Feel free to also comment on the html markup.


Here's a link to the html file in question http://216.180.231.91/~jnmartin/


and here is the text in the style
sheet------------------------------------------------------


/*++++++++++++++++++++++++++++++++                      styles for
html elements*/
html, body {
        margin: 0;
        padding: 0;
}
body {
        color: white;
        background: url(images/bg_image.gif) fixed;
        font-family:"Times New Roman", Times, "New York", serif;
        text-align: center;
}
h1 {
        font: 900 italic 16px "Times New Roman", Times, "New York", serif;
        letter-spacing: 0.11em;
}
#content p {
        line-height: 148%;
}
/*++++++++++++++++++++++++++++++    end of styles for html elements*/




/*++++++++++++++++++++++++++++++++++++++++++       navigation menus*/
#navmain{
        position: absolute;
        top:120px;
        margin: 0;
        padding: 0;
        z-index: 999;
}
#navmain li {
        list-style: none;
        float: left;
        margin-left: 2px;
        padding-left: 16px;
        font-size: 15px;
        line-height:20px;
        white-space: nowrap;
        background: #00005a url(images/tab_bg.gif) 0 100% no-repeat;
}
#navmain a{
        display: block;
        float: left;
        padding: 0 18px 3px 0;
        text-decoration: none;
        font-weight: bold;
        background: #00005a url(images/tab_bg.gif) 100% 100% no-repeat;
        color: #57b8ad;
        width: .1em;
}
html>body #navmain a {width: auto;} /*fixes IE6 hack */
        /*This comment hides the rule from IE5-Mac\*/
        #navmain a {float: none;} /*End IE5-Mac hack\*/

#navmain a:hover {
        color: white;
}
#navsec {
        position: absolute;
        top: 150px;
        left: -33px;
        list-style: none;
}
* html #navsec a {
        width: 100px;
}
#navsec a {
        font-size: 12px;
        line-height:28px;
        letter-spacing: 0.07em;
        color: #57b8ad;
        text-decoration: none;
        display: block;
        width: 100px;
        height: 30px;
        background-color: #000036;
        margin-top: 1px;
        margin-bottom: 3px;
        padding-left: 10px;
        border: 2px solid black;
}
#navsec a:hover {
        color: white;
}
/*++++++++++++++++++++++++++++++++++++++                    ends nav menus*/





/*+++++++++++++++++++++++++++++++                  div positioning and styling*/
#bigcontainer {
        text-align: left;
        position: relative;
        width: 567px;
        background: #00005a;
        margin: 20px auto;
        padding: 0;
}
#smallcontainer {
        position: relative;
        top: 10px;
        border: 1px solid yellow;
}
#pageheader {
        position: absolute;
        top: 0;
        width: 567px;
        height: 120px;
        margin:0;
        padding: 0;
        background: #000036 url(images/banner.gif) left top no-repeat;
        z-index: 1000;
}
#pageheader span {
        display: none;
}
#content{
        background: #000036 url(images/content_bg.gif) top no-repeat;
        width: 400px;
        position: relative;
        top: 138px;
        left:130px;
        margin-top:30px;
        padding: 10px;
        border: 2px solid black;
}
/*++++++++++++++++++++++++++++++++++                        ends positioning*/
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/