2016年03月20日
Tweet
このブログのデザイン。結構気に入っています。
文字サイズやら細々としたところを修正しながら使っています。
最近になって、レスポンシブデザインというのがあるようです。タブレットとか、ブラウザでウインドウサイズを変更したときに、メニューなどの配置がかわるヤツですね。
僕自身が気になっていたのは、ウインドウサイズに応じて記事の幅を変更したかったのです。今まではそれらが固定的でした。
float という css を利用してコンテンツを配置したのですが、この方法ではいまいちうまくいきませんでした。
ウインドウサイズを大きくしたり小さくしたりすると、余白も同様に大きくなったり小さくなったり・・。width などの値をパーセントで指定しているのが悪いのだと思うのですが、色々試してもうまくいかなかったんです・・。
CSSを利用した段組の方法として、table というのがあるようです。昔は table タグでレイアウトしていましたが、CSSでも table とは!
とりあえず table と table-cell を利用したところ、意図通りにできました。
このブログを読んでいるブラウザのサイズを変更すると、記事の表示エリアも拡大縮小します。
そして・・・・・・・・・ウインドウが小さくなったときにはメニューを追いやったりしたいのですが、それはまだです。
文字サイズやら細々としたところを修正しながら使っています。
最近になって、レスポンシブデザインというのがあるようです。タブレットとか、ブラウザでウインドウサイズを変更したときに、メニューなどの配置がかわるヤツですね。
僕自身が気になっていたのは、ウインドウサイズに応じて記事の幅を変更したかったのです。今まではそれらが固定的でした。
float という css を利用してコンテンツを配置したのですが、この方法ではいまいちうまくいきませんでした。
ウインドウサイズを大きくしたり小さくしたりすると、余白も同様に大きくなったり小さくなったり・・。width などの値をパーセントで指定しているのが悪いのだと思うのですが、色々試してもうまくいかなかったんです・・。
CSSを利用した段組の方法として、table というのがあるようです。昔は table タグでレイアウトしていましたが、CSSでも table とは!
とりあえず table と table-cell を利用したところ、意図通りにできました。
このブログを読んでいるブラウザのサイズを変更すると、記事の表示エリアも拡大縮小します。
そして・・・・・・・・・ウインドウが小さくなったときにはメニューを追いやったりしたいのですが、それはまだです。