Мне нужно уменьшить расстояние между элементами, которые показывают информацию, такую как расписание и контакт, но я не смог этого достичь.
Это мой код:
<div class="row">
<div class="col s12 m12 l6 logo center-align">
<img class="responsive-img" src="logo.png" alt="">
</div>
<div class="col s12 m6 l3 d-flex">
<div class="">
<div class="col s12 m2 l2">
<i class="material-icons header-icons">access_time</i>
</div>
<div class="col s12 m10 l10">
<div class="d-flex text">
<span class="title-header">Horario</span>
<span class="header-info-content">Mon-Sat Day: 9am to 7pm</span>
</div>
</div>
</div>
</div>
<div class="col s12 m6 l3 d-flex">
<div class="">
<div class="col s12 m2 l2">
<i class="material-icons header-icons">phone</i>
</div>
<div class="col s12 m10 l10">
<div class="d-flex text">
<span class="title-header">Contacto</span>
<span class="header-info-content">55 6789 7899</span>
</div>
</div>
</div>
</div>
</div>
Код CSS:
i.material-icons {
vertical-align: middle;
}
.d-flex {
display: flex;
justify-content: center;
}
.text {
flex-direction: column;
margin-left: 15px;
}
.header-icons {
font-size: 40px;
}
.title-header {
font-size: 18px;
color: rgb(54, 181, 240);
}
.header-info-content {
font-size: 12px;
color: grey;
}
Я добавляю изображение, чтобы объяснить себя лучше.
Я хочу достичь этого с помощью Materialise CSS