css3 - CSS div float. push last div up -


i have 5 <div> elements , float left.

enter image description here

how can push last div? (i cant use 2 more wrappers because re-sized jquery, 5 of them must in same wrapper)

enter image description here

i don't know if explain problem in right way if have question, please ask.

html:

<div id="modelisadrzajair">     <div class="kocka220x140">1</div>     <div class="kocka220x140">2</div>     <div class="kocka220x300">3</div>     <div class="kocka220x300">4</div>     <div class="kocka460x140">5</div> </div> 

css:

#modelisadrzajair {     width: 960px;     margin: -60px 0px 0px -10px;     min-height: 500px;     background-color: #00ffff;     position: absolute;     z-index: 1000; }  .kocka220x140 {     border-radius:5px;     width: 220px;     margin: 10px;     height: 140px;     float: left;     background-color: #ffff00; } .kocka220x300 {     border-radius: 5px;     width: 220px;     margin: 10px;     height: 300px;     float: left;     background-color: #ff0000; } .kocka460x140 {     border-radius: 5px;     width: 460px;     margin: 10px;     height: 140px;     float: left;     background-color: #ff0000; } 

fiddle

you've set .kocka220x300's float property left right

i suggest change html this

<div id="modelisadrzajair">     <div class="kocka220x140">1</div>     <div class="kocka220x140">2</div>     <div class="kocka220x300">4</div> <!-- comes first  -->     <div class="kocka220x300">3</div> <!-- comes second -->     <div class="kocka460x140">5</div> </div> 

this way, 3 on left side of 4, check fiddle link update


Comments

Popular posts from this blog

c# - How to get the current UAC mode -

postgresql - Lazarus + Postgres: incomplete startup packet -

javascript - Ajax jqXHR.status==0 fix error -