0

タグクラウド風の単語を表示しています。各単語は小さなdivに含まれ、各行に多く表示されるようにフロートされています。ただし、一部のdivでフォントサイズを変更し始めると、次のスクリーンショットのように、線の構造が崩れ、大きなギャップが表示されます。

ここに画像の説明を入力してください

誰かがこれを解決する方法について何かアドバイスを提供できますか？大きなタグの横に小さなタグの複数の行を配置するなど、特別なことは何もしたくありません。divが通常の行構造に従うようにしたいだけです。

関連するcssは次のとおりです。

div.example {
background-color: #8C7D80;
padding: 2px;
margin: 2px;
float: left;
color: #96888B;
text-align: center;
position: relative;
}
4

2 に答える 2

2

行の高さを上げてみてください。角かっこが大きすぎるように見えるため、線が壊れています。

div.example {
  // other stuff here
  line-height: 1.5
}

固定の行の高さを設定することは可能ですか？

于 2012-05-08T16:34:09.420 に答える
1

高さを明示的に設定するか、line-heightプロパティを変更することをお勧めします。

div.example {
    background-color: #8C7D80;
    padding: 2px;
    margin: 2px;
    float: left;
    line-height: 25px;
    height: 25px;
    color: #96888B;
    text-align: center;
    position: relative;
}
于 2012-05-08T16:36:04.203 に答える