私はタイトルバーdivを持つパネルdivを持っています。タイトルバーの右側にいくつかの異なるアイコンがある場合があります(実行時に決定されます)。アイコンが常に可能な限り右側にスタックするようにCSSを構築しようとしています。また、タイトルテキストがアイコンの上に重ならないようにします(つまり、次の場合は新しい行に折り返されます)必要)。私はそれを正しく理解することができませんでした。私のアイコンについては、私は<img class="icon" ...>
どこにあります
.icon {
display: block;
float: right;
padding-left: 4px;
}
アイコンはそれ自体で正常に表示されます。しかし、実際のタイトルを追加しようとすると、物事が不安定になるときです。左側の残りのスペースを正しく占めるタイトルを取得できないようです。div(または私が試したスパン)は、アイコンの下または上に完全に表示されます。または、タイトルの長さによっては、アイコンが右側に垂直に積み重ねられる場合もあります。
つまり、本質的に、私が探しているのは、右上に水平に積み重ねられた1つ以上の小さな固定サイズの要素と、左側の残りのスペースを占める長い要素であり、この最後の要素は、より多くのスペースを占めることになります。テキストの折り返しがあるかどうかに応じて垂直方向に。
どんな助けでも大歓迎です!