的CSS列魔術

Question

我有以下佈局：

b1  b2  b3 
c1  c2  c3 

，並想插入先生。 #monster（哎呀！）不改變現有佈局，但實現了以下內容：

b1  b2  b3 
ARGH   c3 
c1  c2  

小提琴： http://jsfiddle.net/tt5P8/

的目標是擁有一套固定的CSS規則，其中刪除或添加的怪物（ARGH）div將會看起來像圖1或2.

Answer 1

這是你在找什麼？

http://jsfiddle.net/tt5P8/1/

#main 
{ 
    width: 300px; 
    overflow:hidden; 
} 

.box 
{ 
    float: left; 
    width: 100px; 
    height: 50px; 
} 

.col 
{ 
    float: left; 
    width: 85px; 
    height: auto; 
    margin-right: 15px; 
    background-color: #CCC; 
} 

#monster 
{ 
    width: 185px; 
    margin-right: 15px; 
    height: 100px; 

} 

也許我不理解的問題？