キレイにdiv要素を横並びにするCSSサンプルです。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 | .cap{margin:2em02.5em;padding:1em1.5em;line-height:2.0;border:1pxdashed#cdcdcd; background:#fcfcfc; box-shadow: 0 1px 3px 0 rgba(195,195,195,0.3);} .capbr{clear:both;} /*小さいデバイスでは横に並べる数を変更*/ @mediascreenand(max-width:600px){ .cap{ width:100% } } @mediascreenand(min-width:601px){ .wrap{display:table;margin-bottom:20px;} .cap{ width:500px; display:table-cell; } } |
コメント