У меня около 5 абзацев, и они описывают такие вещи, как «Имя», «Член с» и «Валюта».

Что мне делать в CSS, чтобы уменьшить их высоту.

http://i.imgur.com/EwZPeik.png Это выстрел. Зеленые части под аватаром - это шрифты, которые я хочу, чтобы они были ближе друг к другу с точки зрения вертикального выравнивания.

Любые идеи?

HTML, за которым следует CSS

.user-info-box {
 padding: 25px;
border: 25px;
margin: 25px;
border: 1px solid #2fac66;
}

p {
 color: #2fac66;  

}

#user-avatar {
padding: 5px;
border: 1px solid #2fac66;
}

.avatar-detail {
    color: #2fac66;
}
        <div class="user-info-box">
<img src="images/user-avatar.png" id="user-avatar">

<p class="avatar-detail">[Username]</p><p class="avatar-info">Captain Anderson</p>

<p class="avatar-detail">[Currency]</p>
<p class="avatar-info">1, 132</p></center>
        
        
<p class="avatar-detail">[Member Since]</p>
<p class="avatar-info">September 29th, 2014</p></center>
        
        
<p class="avatar-detail">[Profile]</p>
    <p class="avatar-info"> >> click here</p></center>

</div>
0
Richard Peter Targett 30 Окт 2015 в 00:27

2 ответа

Лучший ответ

Было бы полезно увидеть ваш код, но вы можете сбросить поля и отступы для тегов <p> следующим образом:

p {margin: 0; padding:0;}

А затем измените высоту строки тегов абзаца на желаемую высоту в пикселях.

p {margin: 0; padding:0; line-height: 15px;}
1
Mr Lister 17 Ноя 2015 в 09:57
p {
Line height: 50%;
}

КУДОС!

1
Richard Peter Targett 29 Окт 2015 в 21:53