ちょいちょい忘れるんでメモ。良く画像とテキストの横並びさせることがあるが、個人的には下記のようなCSSを記述することがある。
まぁ今さらっちゃ今更。
.left{
width:200px;
float:left;
}
.right{
margin-left:200px;
}
でも、両方とも幅を指定したくない時ってあったりする。例えば、スマートフォンの場合は可変で作ることがほとんどだし。(まぁだいたい1カラムレイアウトだと思いますが)
そんな時は、回り込ませる要素に「overflow:hidden」を使用すると幅を指定しなくても横並びにできる。
.left{
float:left;
}
.right{
overflow:hidden;
*zoom:1; /* for ie7 */
}
サンプルと言う訳でもないが、2パターンをjsdo itを使ってみたかったので載せておく。