0

Верстаю сайт. Первый вопрос: при наведении мышки на пункт Главного меню почему оно не подсвечивается на всю ширину (от правого до левого border'a)? Какое CSS правило нужно прописать?

Второй вопрос: если прокрутить страницу вниз до пункта "TESTIMONIALS", там заголовок сделан как h5 с классом "h5". Я прописал такие CSS стили:

h5.h5:before{
    background-image: url(http://evolutionnailspanj.brandivo.com/wp-content/uploads/sites/30/2015/02/h5.png);
    background-position: 0% 0%;
    background-repeat: no-repeat;
    width: 101px;
    height: 79px;
}

Но картинка не отображается, почему так происходит?

1
  • если используете before - необходимо прописать content: '';
    – soledar10
    19 фев 2015 в 17:50

2 ответа 2

2

Список меню li через display-inline.

Большинство браузеров разделяет строчные блоки отступами.

Для того чтобы этого небыло, варианты, как от этого избавиться:

1) родителю font-size: 0px; это свойство наследуется, и перебить его для самих потомков

shortcodes.css:4038

#top .av-submenu-pos-center { 
  font-size: 0px;
  text-align: center;
}

2) список в одну строку

<ul>
<li>Стороки.</li><li>Просто</li><li>строки</li>
</ul>

3) не закрывать тег li

 <ul>
        <li>Стороки.
        <li>Просто
        <li>строки
    </ul>
2

Чтобы отображалась картинка с кавычками, нужно сделать padding, а не margin. И никакого псевдокласса before не нужно

h5.h5 {
font-size: 18px;
text-transform: uppercase;
margin-top: 5px;
padding: 10px;
padding-left: 70px;
background-image: url("//evolutionnailspanj.brandivo.com/wp-content/uploads/sites/30/2015/02/h5.png");
background-size: 50px 40px;
background-repeat: no-repeat;
background-position: 0% 0%;
}

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими пользовательским соглашением, политикой конфиденциальности и политикой о куки

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.