私が欲しいもの:
----------------------------------------------------------------
| | | |
| | other divs like div_3 & div_4 | |
| | | |
| |--------------------------------------------| |
| | | | |
| div_1 | div_3 | div_4 | div_2 |
|(static)| (Static) | (Fluid) |(static)|
| | | | |
| | | | |
| |--------------------------------------------| |
| | | |
| | other divs like div_3 & div_4 | |
| | | |
----------------------------------------------------------------
私が得るもの:
----------------------------------------------------------------
| | | |
| | other divs like div_3 & div_4 | |
| | | |
| |--------------------------------------------| |
| | | | |
| | | div_4 | |
| | | (Fluid) | |
| | | | |
| |--------------------------------------------| |
| | | | |
| div_1 | div_3 | | div_2 |
|(static)| (Static) | |(static)|
| | | | |
| | | | |
| |--------------------------------------------| |
| | | |
| | other divs like div_3 & div_4 | |
| | | |
----------------------------------------------------------------
注:div_3とdiv_4は、それらの上下に他のコンテンツがあるため、個別のグループ化ラッパーに含まれています
私の問題は、(少なくとも私が信じていることですが)div_4のマージンが残っているために、div_3がdiv_4の下でずらされてしまうことです。
また、div_3とdiv_4はラッパー内にあるため、div_1に使用した負のマージン左トリックを使用することはできません。
#div_1{
float: left;
width: 50px;
margin-left: -100%;
}
#div_2{
float: left;
width: 50px;
margin-left: -20px;
}
#div_3_and_div_4_wrapper {
margin: 0 50px 0 50px;
}
#div_3 {
clear:left;
float:left;
width: 250px;
}
#div_4{
margin-left: 250px;
}