位置相対重なりフロート：左 -

Question

http://klarbild.probiermau.ch/static/index.html

I左フローティング青いボックスを有しています。 オレンジ色のボックスが1つあります。

オレンジボックスはは彼らにと重ならない、内部浮動ブルーボックスを配置する必要があります。 青いボックスは、の周りに、のオレンジ色のボックスが浮いている必要があります。

これは可能ですか？ヒント？

編集： オレンジ色のボックスの位置を変更するには、cssを使用する必要があります。青色のボックスは常にオレンジ色のものの周りに浮かぶべきです。オレンジ色の箱の後ろに "隠されていない" beeingなし。

どうもありがとう

Answer 1

ヒント：http://jsfiddle.net/4Bber/1/

コード：

<div class="wrapper"> 
    <div>blue 1</div> 
    <div>blue 2</div> 
    <div>blue 3</div> 
    <div>blue 4</div> 
    <div>blue 5</div> 
    <div>blue 6</div> 
    <div id="orange"></div> 
    <div>blue 7</div> 
    <div>blue 8</div> 
    <div>blue 9</div> 
    <div>blue 10</div> 
    <div>blue 11</div> 
    <div>blue 12</div> 
    <div>blue 13</div> 
    <div>blue 14</div> 
</div> 

オレンジボックスの位置を変更し、（ position : relativeなし）右にフロート

この例のフィドルを参照してください。

ssss

.wrapper { width: 440px; } 
.wrapper div { 
    width  : 100px; 
    height  : 100px; 
    background : blue; 
    float  : left; 
    margin  : 0 0 10px 10px; 
    color  : #fff; 
} 

#orange { 
    background : orange; 
    width  : 210px; 
    height  : 210px; 
    float  : right; 
}