[DIV] Nebeneinander aber Verrutscht

[Tingeltangelbob]

Hallo Community,

Ich bin gerade dabei eine Seite zu Schreiben aber Ich scheitere gerade an einer [div] Positionierung.
Um sich das ganze Besser vorzustellen habe Ich hier ein Screenshot und unten drunter den CSS sowie HTML Code.

Kann mir jemmand dabei helfen dieses Problem zu lösen?



CSS Code:

#communityPostsContent
{
    margin:                0;
    padding:            0;
    margin-top:            50%;
    height:                522px;
    width:                100%;
    background:            #ffffff;
    border-top:            1px solid #d3d3d3;
    border-bottom:        1px solid #d3d3d3;
}

#communityPostsWrapper
{
    margin:                0;
    padding:            0;
    margin-top:            30px;
    margin-left:        260px;
    width:                1400px;
    height:                90%;
    display:            inline-block;
}

#communityPostsTable
{
    margin:                0;
    padding:            0;
    height:                457px;
    width:                329px;
    display:            inline-block;
}

#communityPostsHeader
{
    margin:                0;
    padding:            0;
    width:                329px;
    height:                57px;
    background-image:    url('cTable.jpg');
    color:                #ffffff;
    font-family:        Tahoma;
    font-weight:        bold;
    font-size:            10pt;
}

#communityPostsBack
{
    margin:                0;
    padding:            0;
    height:                400px;
    background-image:    url('cPostsBG.jpg');
}

#communityPostsUserList
{
    margin:                0;
    padding:            0;
    margin-left:        8px;
    color:                #404040;
    font-family:        Tahoma;
    font-weight:        bold;
    font-size:            10pt;
    line-height:        0.59in;
    display:            inline-block;
}

#communityPostsUserPosts
{
    margin:                0;
    padding:            0;
    margin-left:        20px;
    color:                #B5B5B5;
    font-family:        Tahoma;
    font-weight:        normal;
    font-size:            10pt;
    line-height:        0.59in;    
    display:            inline-block;
}

---

HTML Code:

            <div id="communityPostsContent">
                <div id="communityPostsWrapper">
                    <div id="communityPostsTable">
                        <div id="communityPostsHeader">
                            <br>&nbsp;&nbsp;Letzte Benutzereinträge
                        </div>
                        <div id="communityPostsBack">
                            <div id="communityPostsUserList">
                                Barney_Stinson:
                                <br>
                                Ted_Mosby:
                                <br>
                                Marshall_Eriksen:
                                <br>
                                Robin_Scherbatsky:
                                <br>
                                Lily_Aldrin:
                                <br>
                                Kevin_James:
                                <br>
                                Jason_Statham:
                            </div>
                            <div id="communityPostsUserPosts">
                                    Tell'em, Barney
                                    <br>
                                    Maybe it's destiny?
                                    <br>
                                    Beercules!!!!
                                    <br>
                                    Blue Horn
                                    <br>
                                    James is gay. 
                                    <br>
                                    hmmm...
                                    <br>
                                    We're Safe
                            </div>
                        </div>
                    </div>
                    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                    <div id="communityPostsTable">
                        <div id="communityPostsHeader">
                            <br>&nbsp;&nbsp;Letzte Neuigkeiten
                        </div>
                        <div id="communityPostsBack">
                            <div id="communityPostsUserList">
                                Hallo
                            </div>
                        </div>
                    </div>
                </div>
            </div>

 

[Cheffchen]

Hallo,

also grundsätzlich fragezeichen las ich jetzt mal weg wie 1400px breit + 260margin=1660px breit, is das jetzt standard :O).

Dein fehler ist wohl #communityPostsTable { da hast display: inline-block; drin was raus kann dafür ein float:left; rein.

Cheffchen