CSS hjelp

[Dimethyltryptamine]

Trenger litt CSS hjelp.

Bruker float:left på en rekke bokser, men ender opp med en god del ubrukt plass.

 

Slik ser siden ut nå:

 

Og sånn ønsker jeg at den skal ende opp:

 

 

Noen tips til hvordan dette kan utføres?

 

 

HTML:

<div class="box">
<div class="overskrift">Overskrift boks</div>
<div class="innhold">
Innhold. ÆØÅ æøå 
</div>
</div>

CSS:

.box {
display: block;
width: 290px;
border: 1px solid black; 
float: left;
padding-bottom: 10px;
margin: 10px;
}
 
.overskrift {
background-color: #315978;
color: white;
padding: 5px; 
}
 
 
 
.innhold {
padding-top: 5px;
padding-left: 3px;
padding-right: 3px;
}

Endret 28. november 2015 av Dimethyltryptamine

[Fga]

Du kan lage tre div, en for hver kolonne med bokser. Float disse så de legges ved siden av hverandre og legg boksene inni. En ide ihvertfall.

 

EDIT:

Sånn som dette:

 

https://jsfiddle.net/srcqm64c/

Endret 29. november 2015 av Fga

[haugsand]

Det kan også være nyttig å ta en titt på CSS Columns.