Выровнять текст - HTML и CSS

123Ллла · 29.05.2024, 21:41

Здравствуйте, помогите мне выровнять текст чтобы он был идеально ровным во всех 3 блоках, в основном не получается выровнять текст первого блока чтобы был линейно ровным по сравнению с двумя другими.

Вот код:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
.footer_ {
font-family: "DM Serif Display", serif !important;
font-weight: inherit !important;
font-size: 18px !important;
}

.footer-block p {
color: rgb(0,0,0);
font-family: Roboto, sans-serif;
font-weight: 300;
line-height: 2;
}

.footer-blocks {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 10px;
width: 90%;
margin: 0 auto;
box-sizing: border-box;
align-items: start;
}

.footer-block {
padding: 10px;
border-radius: 5px;
display: flex;
flex-direction: column;
}

.footer-block p, .footer-block table {
margin: 0;
}

.box {
display: grid;
grid-template-columns: 1fr 1fr;
grid-column-gap: 0px;
gap: 10px;
}

.box div {
box-sizing: border-box;
}

.box-text{
padding-bottom: 10px;
}

.box-text_p{
line-height: 1.5;
}

.footer-block:nth-child(1) .box-text_p {
margin-top: 0;
}

</style>
</head>
<body>
<div class="footer-blocks">
<div class="footer-block">
<p class="footer_">APIE MUS</p>
<div class="box-text_p">Padedame užtikrinti vaikų ir suaugusių asmenų, turinčių negalią gerovę, saugumą, siekiant pozityvios kiekvieno asmens socializacijos ir integracijos į visuomenę skatinant visavertę asmenybės raišką.</div>
</div>

<div class="footer-block">
<p class="footer_">ADMINISTRACIJOS DARBO LAIKAS</p>
<div class="box">
<div>I–IV</div><div>8.00-17.00</div>
<div>V</div><div>8.00-15.45</div>
<div>VI</div><div>Nedirbam</div>
<div>VII</div><div>Nedirbame</div>
<div>Pietūs</div><div>12.00-12.45</div>
</div>
</div>

<div class="footer-block">
<p class="footer_">KONTAKTAI</p>
<div class="box-text">Kompleksinių paslaugų namai "Alka"</div>
<div class="box">
<div>Įmonės kodas:</div><div>305369449</div>
<div>Adresas:</div><div>Vytauto g. 182, Šiauliai</div>
<div>Telefonas:</div><div><a href="tel:+3704104468">(41) 504468</a></div>
<div>El. paštas:</div><div><a href="mailto:info@kpnalka.lt">info@ kpnalka.lt</a></div>
<div>Paramos sąskaita:</div><div>LT 61 7300 0101 6098 4814</div>
</div>
</div>
</div>
</body>
</html>

Вот фото моего лучшего результата

ADSoft · 03.06.2024, 08:26

а что надо то? чтоб все три столбца имели одинаковую ширину? так оно так и есть похоже.....

03.06.2024, 08:26	#2
ADSoft Старожил Регистрация: 25.02.2007 Сообщений: 4,177	а что надо то? чтоб все три столбца имели одинаковую ширину? так оно так и есть похоже..... Сайты, приложения, автоматизация в широком смысле слова

Похожие темы
Тема	Автор	Раздел	Ответов	Последнее сообщение
Выровнять текст по правому краю	Xoma37	Общие вопросы C/C++	0	22.05.2018 14:54
Выровнять текст на экране на СИ	staccy	Общие вопросы C/C++	0	30.03.2017 20:40
как в мемо выровнять текст по центру	Fahman	Компоненты Delphi	2	11.01.2017 16:55
Тег SELECT - выровнять текст по центру (IE)	Linel	HTML и CSS	0	17.02.2011 13:35
Уважаемые! Как выровнять текст в ComboBox	xitroi	Общие вопросы Delphi	1	18.05.2010 14:05