@kosmok

Почему при уменьшении экрана div увеличивается в высоту(width)?

У меня есть проблема,когда экран уменьшается div увеличивается в высоту.Ширина и высота указана в vw vh вот код:
<body>
<header>
<div class="hed">
    <div class="Home hedB"><p>about us</p></div>
    <div class="portfolio hedB"><p>about us</p></div>
    <div class="about_us hedB"><p>about us</p></div>
    <div class="contact hedB"><p>contact</p></div>
</div>
</header>
</body>

А вот css:
body
{
    margin: 0;
}
header
{
    background-color: 313030;
    width: 70vw;
    height: 10vh;
    margin:0 auto;
    margin-top: 3vh;
    max-height: 10vh;
}
.hed
{
    display: grid;
    grid-template-columns: repeat(4,1fr);
    width: 35vw;
    height: 10vh;
    margin:0 auto;
}

.hedB
{
    background-color: 313030;
    height: 10vh;
}

.hedB:hover
{
    background-color: red;
}

.Home p,.portfolio p,.about_us p,.contact p
{
    font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif;
    color: white;
    font-size: 1.3vw;
    text-align:center;
}

Почему при уменьшении окна увеличивается высота блока? Не помогло.
  • Вопрос задан
  • 313 просмотров
Пригласить эксперта
Ваш ответ на вопрос

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

Похожие вопросы