[css-d] 2 column layout confusion

[jblanchard]

Howdy gurus,

I am still working on the same design and now have a problem with 2
column layout. In FF the tops of the left column and right column are
somewhere above the bottom of header. In IE I had to add a <br
clear="all /> after the header to get the tops of the left and right
columns to line up.

        <div id="container">
        
                <div id="header">
                        <div class="left"></div>
                        <div class="right" align="right">
                                <h2>Phone - Quick Users Guide</h2>
                        </div>
                </div><!-- /header -->
                <br clear="all" />

<div id="content">

        <div class="leftContent">
                <a href="docs/7940.pdf" target="_blank">7940 User's
Guide</a><br />
                <a href="docs/7912.pdf" target="_blank">7912 User's
Guide</a><br />
        </div><!-- leftContent -->

        <div class="rightContent">
        <p><strong>VoIP User's Instructions</strong></p>
                <ul>

#content {
        background: transparent;
        font-size: 0.8em;
        height: auto;
        text-align: justify;
        padding: 0;
        z-index: 0;
}
#content div.leftContent {
        float: left;
        width:185px;
        padding-left: 5px;
}
#content div.rightContent{
        margin: 0px 40px 0px 210px;     
}

I think that the problem is that I am attempting a reasonably complex
layout without all of the CSS knowledge that I need to do so. Can
someone show me the error of my ways? Thanks! Here is the test URL...

http://www.sigmaphinothing.org/voip.html

______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/