指定するという方法があります。これだけではIE6では上手くいかなことがあります。指定も必要だったようです。・overflow:hidden;・width:○○○;この2つを指定しましょう。今まではdt、ddにきっちりwidthを指定し、それぞれにborder-bottomを指定。dtにfloat:left;、ddにfloat:right;を指定するという方法でやっていました。「う」の段のように、ddのテキストの行数がdlよりも多いとborder-bottomがずれてしまいます。「え」の段のように、逆にdtのテキストの行数が多いと「お」の段が回り込んでしまいます。すると、一段ずつdlにするというような何とも不細工なソースになってしまっていました。調べてみると、下記の様にすればで崩れずソースもきれいなままです。それは、dtにwidthとfloat:left;を指定border-bottomの指定はナシ。ddには、dtのwidth分のpadding-leftとborder-bottomを指定、floatとwidthの指定はナシ。具体的にはこんな感じです。コメント(0)リストなどで1行が長くなってしまうと、|※テキストテキスト|※テキストテキストテキストテキ|ストテキスト|※テキストテキストテキ折り返されてこのようになってしまいます。折り返されたあとは※ではなく文字の初め(テキストの"テ")に合わせたいということが殆どかと思います。今まではpaddingと背景画像を使って再現していたのですが、もっとずっと楽な方法があること知ったのでメモしておきます。上の例がリストであるとして、ソースはこのようになっていると思います。<ul><li>※テキストテキスト</li><li>※テキストテキストテキストテキストテキスト</li><li>※テキストテキストテキ</li></ul>まず、この<li>タグに左paddingを指定します。1文字分、と指定するのがいいと思いますが、崩れる場合もあるようなのでそのときはピクセルで。これで一文字分、右にずれることになります。※テキストテキストテキ次に、行の先頭だけ左にずらします。タグにtext-indentを指定します。text-indent:-1em;これで頭だけ左にずれ、改行後の先頭はテキストに揃う形になります。ストテキスト|※テキストテキストテキそれにしても、text-indentなんてまさにこういう用途のために用意されているようなクラスですよね・・もしくは先頭1文字下げるとか。普段、画像置き換えのために文字を吹っ飛ばすくらいしか使っていなかったので、目から鱗な気分です。検索このアーカイブについてこのページには、2011年4月に書かれたブログ記事が新しい順に公開されています。前のアーカイブは2010年3月です。次のアーカイブは2011年7月です。最近のコンテンツはインデックスページで見られます。過去に書かれたものはアーカイブのページで見られます。