Невозможно применить цвет фона к пользовательской навигации с помощью CSS

У меня нет идеи, почему и как, но я, по-видимому, не могу изменить цвет фона navbar на моем сайте. Я пытаюсь создать свой собственный шаблон WHMCS inline с моим шаблоном joomla, и независимо от того, что я делаю, цвет фона не изменится?Невозможно применить цвет фона к пользовательской навигации с помощью CSS

The dev site is here

Я хочу, чтобы преобразовать весь фон NavBar черный. Я могу преобразовать фон в черный, но бит справа от ссылок остается серым. Я озадачен и понимаю, что это должно быть что-то глупое, что я сделал?

Это HTML у меня есть для моего меню:

<header id="gkHeader"> 
    <div>  
     <div class="gkPage" id="gkHeaderNav"> 
      <a href="https://www.sitewidedesign.co.uk/" id="gkLogo" class="cssLogo">Site Wide Design</a> 
      <div id="gkMainMenu"> 
       <nav id="gkExtraMenu" class="gkMenu"> 
       <ul class="gkmenu level0"> 
        <li class="first active"><a href="https://www.sitewidedesign.co.uk/" class=" first active" id="menu120" >Home</a></li> 
        <li ><a href="/k2/latest" id="menu333" >Blog</a></li> 
        <li ><a href="/faq" id="menu458" >FAQ</a></li> 
        <li ><a href="/login/login" id="menu472" >Login</a></li> 
        <li class="last"><a href="/web-hosting" class=" last" id="menu477" >Hosting</a></li> 
       </ul> 
       </nav> 
      </div> 
     </div>   
     <div class="gkPreHeader"> 
      <nav id="gkPreHeaderMenu" class="gkMenu"> 
       <ul> 
        <li class="first active"><a href="/hosting/domainchecker.php" class=" first active" id="menu300" >Domains</a></li> 
        <li ><a href="hosting/domainchecker.php" id="menu333" >Blog</a></li> 
        <li ><a href="/hosting/knowledgebase.php" id="menu458" >Knowledgebase</a></li> 
        <li ><a href="/login/login" id="menu472" >Login</a></li> 
        <li class="last"><a href="/hosting/clientarea.php" class=" last" >My Account</a></li> 
       </ul> 
      </nav> 
     </div>    
    </div>

Тот, я хочу, чтобы иметь черный фон является gkPreHeader. Я пробовал следующий css, но он не влияет на весь div, как вы можете видеть на моем сайте.

.gkPreHeader { 
    float:left; 
    clear:both; 
    background-color:#000; 
    overflow:auto; 
}

Любые предложения были бы наиболее желанными. С уважением Donna

источник

2016-05-10 Dtorr1981

Я вижу это хорошо в вашем веб-сайте, без 'float' в заголовке размер заголовка составляет 100% черный фон –

В настоящее время это хорошо. ** Вероятно, вы должны удалить вопрос **. При плавании элемент рушился до его естественной ширины, таким образом, вы могли видеть серый фон «заголовка» справа от него. – Moob

А, я должен согласиться с OP, он для меня белый, обновил дерьмо из этого сайта, все еще белый .. изменил размер окна + обновить, все еще ** белый ** заголовок фона. – argon

Необходимо очистить навигацию, чтобы она имела высоту. Вы можете сделать это (также вы можете применить это к вашему первому/верхнем меню - .gkMenu):

.gkMenu2:before, .gkMenu2:after { 
    content: ""; 
    display: table; 
} 
.gkMenu2::after { 
    clear: both; 
}

После этого, нав будет иметь его высота назад, и вы можете изменить цвет фона на него.

облегченная чтение о теме: http://nicolasgallagher.com/micro-clearfix-hack/

источник

2016-05-10 14:33:42 MajeStic

Невозможно применить цвет фона к пользовательской навигации с помощью CSS

ответ

Смежные вопросы