内部にコンテンツを含む多数の div があり、テキストを自動的に調整したい! たとえば、div 1 では、テキストの長さとサイズが他の div とは異なる可能性があるため、1 つの CSS ルールを設定して、それらの属性に関係なくテキストが構造化されていることを確認したいと考えています。
HTML
<div id="#info-1">
<h4>Subtitle</h4>
<h1>Title</h1>
<h3>Subtitle</h3>
</div>
<div id="#info-2">
<h4>Subtitle</h4>
<h1>Title</h1>
<h3>Subtitle</h3>
</div>
<div id="#info-3">
<h4>Subtitle</h4>
<h1>Title</h1>
<h3>Subtitle</h3>
</div>
CSS
#info-1, #info-2, #info-3{
position:absolute;
top:0px;
margin-top: 75px;
margin-left:350px;
float: left
}
#info-1 h3, #info-2 h3, #info-3 h3
{
position:absolute;
top: 105px;
left: 130px;
}
#info-1 h4, #info-2 h4, #info-3 h4
{
position:absolute;
top:40px;
left:75px;
}
#info-1, #info-2, #info-3, #info-4{
background-color: lightgrey;
width:300px; height:175px;
}
#info-1 h1, #info-2 h1,#info-3 h1
{
position:absolute;top: 55px; left:60px;
color: white;
text-transform: uppercase;
}