및 h2
태그가 포함 된 3 개의 콘텐츠 상자를 모두 인라인으로 표시하려고합니다.Css divs and h1 h2
상자를 정렬했지만 h1
및 h2
태그를 스타일링하는 데 문제가있는 것으로 보입니다. 그들은 단지 스타일하지 않을 것입니다. 아니 내가 속기 상기 h1
및 h2
이 내 CSS에 대한 올바른 CSS를 가지고 있는지 확인하는 경우 :
#day1, #day2, #day3 {width: 230px; height: 100px; margin-bottom:15px; background:#fff; word-wrap: break-word; display:inline-block; position:relative;}
#day1 {float: left;}
#day2 {margin-left: 15px; float: left;}
#day3 {float: right;}
#day1, #day2, #day3 h1 { font-size:18px; font-weight:200; color:#4778DE; padding:0 5px;}
#day1, #day2, #day3 h2 { font-size:12px; font-weight:200; color:#4778DE; padding:0 5px;}
#daybutton {position: absolute; display:inline-block; bottom:0; margin-left: 130px; margin-bottom:5px;}
#daybutton p { font-size:12px; color:#4d4d4d;}
#daybutton p a { font-size:14px; color:#4778DE; text-decoration:none;}
#daybutton p a:hover {color:#88B828; text-decoration:none;}
과 HTML :
<div id="day1">
<h1>Name Here</h1>
<h2>Job Title Here</h2>
<div id="daybutton">
<p><a href="#">Read more ></a> </p>
</div>
</div>
<div id="day2">
<h1>Name Here</h1>
<h2>Job Title Here</h2>
<div id="daybutton">
<p><a href="#">Read more ></a> </p>
</div>
</div>
<div id="day3">
<h1>Name Here</h1>
<h2>Job Title Here</h2>
<div id="daybutton">
<p><a href="#">Read more ></a> </p>
</div>
</div>
빠른 응답 주셔서 감사합니다. Fraser - 이제 완벽하게 작동합니다. – user1809742
걱정할 필요가 없습니다. 다행히 도울 수있어. – Fraser