菊池 崇の実践！CSS3道場CSS3（Cascading Style Sheets,level 3）がいよいよ実用段階に入ってきた。大半のモダンブラウザーで実装が進み、アップルやグーグルなどの先進企業がCSS3を本格的に活用し始めている。デザイン表現の自由度を広げ、マークアップの効率を上げるCSS3のTipsを具体的なサンプルとともに紹介する。
ネガティブマージン 右側を固定幅にしたリキッドレイアウト - bnote
floatを使った2段組で、右側が横幅固定で、左側が画面横幅の残りを可変でということをしたいとき、 どうしたら実現できるのでしょう。 例えば、左側を可変で右側を200pxとした場合、左側の width に100% - 200px と指定できれば問題ないのですが このような指定はできそうにありません。 これを解決する方法が ネガティブマージン になります。 [参考:Creating Liquid Layouts with Negative Margins] 可変にしたいほうの段のwidthを100%とし、marginをマイナスのピクセルを指定することによって リキッドレイアウト を実現することができます。 例えば、上記例のような場合、左側の段に width を 100% とし、margin-right を -200px と float:left を指定します。 左側の段の width は 1
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
