@yanshabalin1

Как сделать расстояние между элементами таблицы?

у меня получается криво косо, не так...
я хочу чтобы выглядело пространство"man"пространство"[mæn]"пространство"мужчина"
<BODY>
    <header>
        <img src="img/English.png" alt="иконка kinolayer" class="text_head">
        <a href="http://kinolayer.info/language.html" class="text_head">ВЫБОР ЯЗЫКА</a><a href="http://kinolayer/sitemap.html" class="text_head">КАРТА САЙТА</a>
        <a href="http://kinolayer.info/english/soveti.html" class="text_head">ПРАКТИЧНЫЕ СОВЕТЫ</a> <a href="http://kinolayer.info/english/materials.html" class="text_head">ПОЛЕЗНЫЕ МАТЕРИАЛЫ</a>
    </header>
    <article>
    <div class="nav">
        <a href="http://kinolayer.info/english.html" class="bread">Английский язык</a> / <a class="bread">тело человека</a>
    </div>
    <div class="words">
    <strong>man</strong><p>[mæn]</p><p>человек, мужчина</p>
    </div>
    </article>
</BODY>

body{
    background:#F1F3F4;
}
header{
    display: flex;
    font-family: 'PT Sans', sans-serif;
    align-items: center;
    width: 75%;
    height: auto;
    margin: auto;
    border: 1px solid #E5E5E5;
    background-color: white;
    border-radius: 8px;
    margin-bottom: 3px;
    font-size: 125%;
}
.text_head{
    padding-left: 1.5%;
    padding-right: 1.5%;
}
.text_head:hover{
    border: 3px solid #E5E5E5;
    border-radius: 8px;
}
article {    
    width: 75%;
    height: auto;
    margin: auto;
    border: 1px solid #E5E5E5;
    background-color: white;
    border-radius: 8px;                
}
.nav{
    display: flex;
    margin: 1%;
    padding: 0.2%;
    border: 1px solid #E5E5E5;
    background: #F1F2F3;
    border-radius: 5px;
    font-size: 120%; 
    font-weight: 500;
}
a{
    display:block;
    text-decoration: none;
    color:#666666;
}
.bread{
    color: #0000C5;
}
.words{
    display: flex;
    align-items: center;
    font-family: 'PT Sans', sans-serif;
    color: #434e5b;
}

Заранее спасибо!
  • Вопрос задан
  • 47 просмотров
Решения вопроса 1
Anitamsk
@Anitamsk
Frontend Dev
5d690cf9335e5467109517.png
К примеру вот так, только у вас не таблица, а блоки с элементами внутри.
.words{
    display: flex;
    align-items: center;
    font-family: 'PT Sans', sans-serif;
    color: #434e5b;
    padding-left: 20px;
}

.words strong {
  margin-right: 5px;
}

.words p {
  margin-left: 10px;
}
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы