Не отображается background-image у div

@olegmorales · Регистрация: 01.04.2015

Author24 — интернет-сервис помощи студентам

Не отображается background-image у div c классом nav-item. Все изображения лежат где надо. Background у header работают как надо. Через img src тоже все работает.

HTML5

<!DOCTYPE html>
<html>
    <head>
    <link href="normalize.css" rel='stylesheet'>
    <link href="index-style.css" rel='stylesheet'>
    <link href='https://fonts.googleapis.com/css?family=Roboto+Condensed&subset=latin,cyrillic' rel='stylesheet' type='text/css'>
    <script src="jquery-2.2.1.js"></script>
    </head>
    <body>
        <header>
            <img src="logo1.png">
            <div class="nav-item"></div>
            <a href="#contacts" class="logo-contacts"> </a>
        </header>
        <a name="contacts">
            <div class="contacts">
            </div>
        </a>
    </body>
</html>

CSS

header {
    background: url('backSmall2.png');
    height: 670px;
}
 
img {
    width: 14%;
    transform:skewY(-1deg);
    margin-top: 40px;
    margin-left: 40px;
    box-shadow:  0 0 10px rgba(0,0,0,0.5);
    transform: rotate(-3deg);
}
 
.nav-item {
    width: 12%;
    background-image: url('frame.png');
    margin-top: 80px;
    margin-left: 140px;
}
 
.logo-contacts {
    background-image: url('frame.png');
}
 
.contacts {
    width: 100%;
    height: 300px;
    background-color: aqua;
}

@newJS · 08.03.2016, 07:46

Сообщение от olegmorales

Все изображения лежат где надо.

А вот браузер думает иначе.

Сообщение от olegmorales

Через img src тоже все работает.

Ну да, картинка это картинка, у неё есть размеры, а фон это фон, и у пустого дива имеем нулевую высоту, как же браузер картинку покажет?

@newJS 2435 / 1114 / 312 Регистрация: 23.06.2011 Сообщений: 3,525
	08.03.2016, 07:46	2
	Сообщение от olegmorales Все изображения лежат где надо. А вот браузер думает иначе. Сообщение от olegmorales Через img src тоже все работает. Ну да, картинка это картинка, у неё есть размеры, а фон это фон, и у пустого дива имеем нулевую высоту, как же браузер картинку покажет? 0