質問 |
||
| 質問者:labilion | CSSで画像を均等配置 | |
|---|---|---|
困り度:
|
widthが800pxのブロック内で同じ大きさの4つの画像を横に一定感覚で配置したいです。 普段は各画像にmarginを設定して均等に見えるようにしているのですが、 他に何かスマートな方法はありますでしょうか? 独自拡張、テーブルの使用以外の方法でお願いいたします。 |
|
質問投稿日時:08/03/17 15:53 質問番号:3870752 |
||
回答良回答20pt |
|
| 回答者:hiyokko7 | <dl>(定義)タグを使って左に回り込み(float:left;)させれば画像を均等に配置できると思います。 <dl>タグではなく、<ul>(リストタグ)を使ってもできそうですね。参考になれば。 ソース <dl> <dt><img src="**"></dt> <dd>テキストなど</dd> </dl> <dl> <dt><img src="**"></dt> <dd>テキストなど</dd> </dl> <dl> <dt><img src="**"></dt> <dd>テキストなど</dd> </dl> スタイルシート dl {float:left;} |
|---|---|
| 種類:アドバイス どんな人:一般人 自信:参考意見 |
|
| |
回答日時:08/03/19 08:39 回答番号:No.2 |
|
| この回答へのお礼 | ありがとうございます。 リストタグでやる事にしました。 |
回答 |
|
| 回答者:goulan | 現在の設定で何か問題があるのでしょうか。ブラウザによって見え方が変わってしまう・・・とか。 スマートかどうかは?ですが、width: 800px; が固定ならば、4つの画像を 800px 幅に均等に並べた画像1枚( width: 800px, height: **px;)にしてしまうという手がありますね。もしその4枚それぞれの間に なにか文章などがあるのでしたら、文字ごと画像にしてしまえば font種別も好みで固定することが出来ます。 |
|---|---|
| 種類:回答 どんな人:一般人 自信:参考意見 |
|
| |
回答日時:08/03/17 22:45 回答番号:No.1 |
|
| この回答へのお礼 | ありがとうございます。 今の書き方で問題があるわけではないのですが、どうもかっこよくない気がしたので・・・ もしかしたらもっと良い書き方があるのではないかと思い質問させていただきました。 |