div och float — webForum

DavidBMedlem sedan jan. 20001 372 inlägg

Frågan22 maj 2008 18:40#1

Hej

Jag har 3 div:ar som i koden nedan, vill att ramen som visas runt 'loginbox' även skall gå runt 'leftcolumn' och 'rightcolumn', som det är nu så ser 'loginbox' mest ut som om ett långt svart streck utan något innehåll, är det möjligtvis någon som vet hur man gör för att få ramen att gå runt även 'leftcolumn' och 'rightcolumn'?

Kan ju lägga ett antal <br/> i 'loginbox' men det känns inte som en särskilt bra lösning.

<head>
<style type="text/css">
#loginbox
{
    background-color: #FFFFFF;
    border: solid 1px black;
}

#leftcolumn 
{
    float: left;
    font-family: Verdana, Arial;
    font-size: 12px;
    padding: 2px;
}

#rightcolumn 
{
    float:right;
    text-align: right;
    font-family: Verdana, Arial;
    font-size: 12px;
    padding: 2px;
}
</style>
</head>

<body>
<div id="loginbox">
    <div id="leftcolumn">
        <p>Leftcolumn</p>
    </div>
    <div id="rightcolumn">
	<p>Rightcolumn</p>
    </div>
</div>
</body>

überfuzzMedlem sedan apr. 2006409 inlägg

22 maj 2008 18:49#2

Vill minnas att float:ade element inte har någon utbredning, har du testat att sätta widht:??px; på columnerna?

PalleMedlem sedan apr. 20003 174 inlägg

22 maj 2008 20:20#3

Du gör ett vanligt misstag - du glömmer att återställa ordningen (clear) på dina divvar efter dina floats. :)

Detta borde göra susen:

#loginbox
{
    background-color: #FFFFFF;
    border: solid 1px black;
    [b]overflow:hidden;[/b]
}