Установка списка html на родительский элемент высота

Хорошо, хорошо описывая эту проблему, очень просто.Установка списка html на родительский элемент высота

http://gflclan.com/gamemann/screenshots/Screenshot_09-15-14-17-06-10.png

Я хочу, что черный цвет парения, чтобы соответствовать высоте делителя. Я знаю, что раньше задавали вопросы, но я пробовал их решения, и он просто не работает.

Вот мой CSS код:

#navbar { 
    text-align: center; 
    margin-left: 20%; 
    margin-right: 20%; 
    background-image: url('navbg.png'); 
    border-radius:15px 15px 0px 0px; 
    padding:1px 1px 1px 1px; 
    box-shadow: 5px 5px 10px #121212; 
    height: auto; 
} 


#navbar ul { 
    list-style-type: none; 
} 

#navbar ul li { 
    font-size: 150%; 
    font-weight: 300; 
    margin-left: 30px; 
    vertical-align: middle; 
    display: inline-block; 
} 

#navbar ul li a { 
    text-decoration:none; 
} 

#navbar li:hover{ 
    background-color: black; 
}

Это может быть легко исправить, но я не могу понять это.

Любая помощь будет оценена по достоинству.

EDIT:

HTML код:

<body> 
    <div id="navbar"> 
     <ul> 
      <li onmouseover="playmsound()"><a href="">Home</a></li> 
      <li onmouseover="playmsound()"><a href="">GFL</a></li> 
      <li onmouseover="playmsound()"><a href="">Forums</a></li> 
     </ul> 
    </div>

Спасибо,

Рой (Gamemann)

источник

2014-09-15 Christian Deacon

А где ваш * делитель * ?? Можете ли вы поделиться HTML? – LcSalazar

Кроме того, если вы используете изображение backgroud только для градиента, было бы намного легче, если бы вы использовали http://css-tricks.com/css3-gradients/ – LcSalazar

Я отредактировал исходное сообщение для добавления в код HTML , –

Вы можете использовать это:

CSS

#navbar { 
    text-align: center; 
    margin-left: 20%; 
    margin-right: 20%; 
    background-image: url('navbg.png'); 
    border-radius:15px 15px 0px 0px; 
    padding:1px 1px 1px 1px; 
    box-shadow: 5px 5px 10px #121212; 
    height: auto; 
} 
#navbar ul { 
    list-style-type: none; 
    margin: 0; 
    padding: 0; 
} 
#navbar ul li { 
    font-size: 150%; 
    font-weight: 300; 
    margin-left: 30px; 
    vertical-align: middle; 
    display: table-cell; 
    height: 75px; 
    width: 1%; 
} 
#navbar ul li a { 
    text-decoration:none; 
} 
#navbar li:hover { 
    background-color: black; 
}

fiddle

источник

2014-09-15 21:45:44

Работает отлично! Благодаря! –

Установка списка html на родительский элемент высота

ответ

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