Браузеры не видят идентификатор у блока и не выводят картинку

208

02 мая 2018, 02:31

Браузеры не видят идентификатор у блока #servimgdisp и не выводят картинку, хотя у рядом стоящих, идентичных, блоков видят и выдают. Пробовал менять картинку и все равно не видит.

<body>
    <nav id="header">
        <a id="aboutnav" href="#about">О компании</a>
        <a id="servicesnav" href="#services">Услуги</a>
        <a id="formnav" href="#form">Заказать ремонт</a>
    </nav>
    <div id="content">
        <img id="contentimg" src="images/iphone4.jpg">
        <span>Apple Friend<br><span id="descrip" >Быстро и качественно отремонтируем ваше Apple устройство,<br> просто оставте заявку и мы вам перезвоним</span></span>
    </div>
    <div id="about">
        О компании
        <p id="abouttext">Apple friend занимается ремонтом и тюнингом вашего Apple устройства, если вы уронили, утопили или разбили ваш смартфон,<br> мы прийдем вам на помощь и сделаем все что в наших силах, что бы вернуть его к жизни. </p>
    </div>
    <div id="services">
        <p id="typeofservices">Виды ремонта</p>
                <div class="serv">
                    <div class="servimg" id="servimgglass"></div> 
                    <p class="servtext">Замена стекла</p>
                </div>
                <div class="serv">
                    <div class="servimg" id="servimgdisp"></div>
                    <p class="servtext">Замена дисплея</p>
                </div>
                <div class="serv" >
                    <div class="servimg" id="servimgbutton"></div>
                    <p class="servtext">Неисправная кнопка</p>
                </div>

CSS:

.serv{
        display: inline-block;
        width: 213px;
        height: 440px; 
        margin: 10px 10px 100px 10px;
        padding: 0px 120px 0px 120px;
        text-align: center;
           }
         .servimg{
        display: inline-block;
        width: 213px;
        height: 440px;
  }
#servimgglass{
    width: 213px;
    height: 440px;
    background-image: url(http://iremont/images/iphone1.png); 
}
#servimgglass:hover{
    width: 213px;
    height: 440px;
    background-image: url(http://iremont/images/iphoneright.png);
    transition: all 0.5s ease-in-out;
}
}
#servimgdisp{
    width: 213px;
    height: 440px;
    background-image: url(http://iremont/images/iphonedisplay.png);
    }
#servimgdisp:hover{
    width: 213px;
    height: 440px;
    background-image: url(http://iremont/images/iphoneright.png);
    transition: all 0.5s ease-in-out;
}
#servimgbutton{
    width: 213px;
    height: 440px;
    background-image: url(http://iremont/images/iphonedisplay.png);
}
#servimgbutton:hover{
    width: 213px;
    height: 440px;
    background-image: url(http://iremont/images/iphoneright.png);
    transition: all 0.5s ease-in-out;
}

ПОСЛЕДНИЕ ВОПРОСЫ

Все вопросы

ТОП-10

Все популярные вопросы

Анимированое табло c обратным отсчетом на jQuery [требует правки]

Вечер добрый! Кто может помочь с задачкой, хочу сделать анимированное табло c обратным отсчетом по клику, на jQuery, но плюс к этому анимацию переворачивающихся...

229

CSS