div och float

HTML & CSS

2 svar · 352 visningar · startad av DavidB

Medlem sedan jan. 20001 372 inlägg
Trådstart#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>
Medlem sedan apr. 2006409 inlägg
#2

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

Medlem sedan apr. 20003 174 inlägg
#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]
}
248 ms totalt · 4 externa anrop · v20260731065814-full.d34c6d5a
120 ms — deklarationer (db)
0 ms — hämta statistik (cache)
123 ms — hämta tråd, inlägg och bilagor (db)
121 ms — ändringar (db)