改行コードで改行
先日実績に追加した「EventCal」ではフッターの所が以下のようなデザインになっています。
この中の「サービス利用規約」から「運営会社について」までの5つのリンクの所なんですけど、皆さまはどうやって実装しますでしょうか?
4つ目のスタッフ募集の前で改行がかかる仕様です。
pの中にaをならべてbrで改行とかが簡単だと思うのですが、5つのリンクがあったらやっぱりulだよなーということで、以前に「Lea Verouのフレシキブルな複数行定義リスト」でそれっぽいのがあったはずだと思いたち、ulを利用しつつ改行コードとwhite-space: preで改行しています。
該当のCSSは以下のような感じです。
#footer .link li { display: inline; } #footer .link li:nth-child(4):before { content: "\000a"; /* 改行コードLFの改行を挿入 */ white-space: pre; }
機会がありましたら利用してみてください。
TrackBack URL :
comment