前回までの復習異なるブラウザでのWebページ確認現在、記事へのコメントのページで、 次のようなスタイルを使って、 「目次を左」「コメントを右」に配置している人が多いと思います。 div.left { float: left; } div.right { float: right; } </pre> そのページを、ノート型パソコンにインストールしている、 「Mozilla Firefox」というブラウザで見てください。 きちんと左右に表示されていますか? **floatを指定するときの注意 [#p5306607] では、どのようにすれば、 Firefoxでもこちらの意図したとおりに表示できるでしょうか? それには、次のようにします。 #pre(novervatim){{ div.left { float: left; width: 22%; } div.right { float: right; width: 72%; } </pre> このように、 floatプロパティを使う場合には、 必ずwidthプロパティも設定してください。 ただし、ウィンドウの幅が小さくなると、 また表示が崩れてしまいますので、注意してください。 |