Я не могу получить свои промежутки, чтобы перейти к новым строкам. они должны сидеть рядом с изображениемне может получить пробел, чтобы перейти к новой строке
Вот мой HTML:
<h2>Club Profile Card</h2>
<div class="clubprofilecard">
<h3><a href=""><img src=""/>Row 1
<span>Row 2</span>
<span>Row 3</span>
<span>Row 4</span>
</a></h3>
</div>
Вот мой CSS:
.clubprofilecard {
padding-bottom:10px;
margin-bottom:10px;
/**border-bottom:1px solid #d0d0d0;*/
}
.clubprofilecard h3{
position:relative;
font:18px/24px DinWebCond,Sans-serif;
box-sizing:border-box;
padding-left:90px;
margin:0px 0px 15px 0px;
}
.clubprofilecard h3 a{
color:#f06000;
border:none;
text-decoration:none;
}
.clubprofilecard img {
position:absolute;
left: 0px;
top: 0px;
width: 80px;
height: 80px;
border-radius:3px;
}
.clubprofilecard h3 a span
{
white-space:nowrap;
float:left;
display:inline-block;
}
.clubprofilecard h2 {
position:relative;
display:inline-block;
font:22px/22px DinWebCond,Sans-serif;
margin:0px;
padding:0px;
}
А вот полученный результат:
Не совсем уверен, что делать здесь.
Почему вы используете пролеты вместо DIV, пролеты рядные где DIV является блочным элементом. – DivineChef