Sadyrbaev
@Sadyrbaev

Из за чего появляется эта белая полоса, никаких отступов нет?

614b8f5579adc183536018.png

Код HTML
<body>
    <section class="section-1 maincolor">
        <header class="container">
            <div class="header-contact">
                <img src="img/iclean2.png" alt="">
                <div>
                    <p>Телeфон:</p>
                    <h3>+7705 555 30 66</h3>
                </div>
            </div>
            <div class="header-contact">
                <img style="height: 33px !important;" src="img/iclean1.png" alt="">
                <div>
                    <p>Адрес:</p>
                    <h3>г. Алматы</h3>
                </div>
            </div>
            <div class="header-contact">
                <img src="img/iclean15.png" alt="">
                <div>
                    <p>Режим работы:</p>
                    <h3>Круглостуочно</h3>
                </div>
            </div>
        </header>
    </section>
    <section class="section-2">
        <div class="container">
            <h3>Химчистка</h3>
            <h1>ПРЕМИУМ<br>КЛАССА</h1>
            <h3>В Алматы</h3>
            <p>Заполните форму
                и получите консультацию
                от наших менеджеров
                по всем вопросам:</p>
        </div>
    </section>
</body>


Код CSS

body {
    font-size: 25%;
    min-width: 1200px;
}

.maincolor {
    background-color: #FDF003;
}

.section-1 {
    height: 116px;
}

.container {
    width: 855px;
    margin: 0 auto;
}

header {
    padding-top: 27px;
    display: flex;
    justify-content: space-between;
}

.header-contact {
    display: flex;
}

.header-contact img {
    width: 27px;
    height: 27px;
}

.header-contact div {
    margin-left: 10px;
}

.header-contact p {
    margin: 0px;
    font-family: Gotham, sans-serif;
    font-weight: 500;
    font-style: normal;
    font-size: 3.5em;
}

.header-contact h3 {
    margin-top: 5px;
    font-family: Gotham, sans-serif;
    font-weight: bold;
    font-style: italic;
    font-size: 6em;
}

.section-2 {
    height: 602px;
    background: url(img/iclean17.png) center top/cover no-repeat;
}
  • Вопрос задан
  • 237 просмотров
Решения вопроса 2
Ankhena
@Ankhena Куратор тега CSS
Нежно люблю верстку
Это margin от h3.
Почитайте про схлопывание и выпадение вертикальных margin (гуглится)
Ответ написан
volkovgst
@volkovgst
Full-Stack PHP/JS Developer
Дефолтные стили браузера удаляли?
Reset CSS
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

614b9c92addab261252269.png
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
GeorgeGeorge
@GeorgeGeorge
Студент
Возможно .section-2 стоит изменить свойство background. Рекомендую залить код на codepen.
Ответ написан
Ваш ответ на вопрос

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

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