div och float

HTML & CSS

2 svar · 338 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]
}
273 ms totalt · 4 externa anrop · v20260731065814-full.d34c6d5a
128 ms — deklarationer (db)
0 ms — hämta statistik (cache)
141 ms — hämta tråd, inlägg och bilagor (db)
129 ms — ändringar (db)