0
У меня есть заголовок, в котором расположено меню таблицы, однако я сталкиваюсь с некоторыми проблемами при попытке сделать border-bottom
, когда вы наведите указатель мыши на определенные td
, border-bottom
появится, когда вы наведите указатель мыши на него, но граница останется, когда вы наведете на другую часть страницы. (Граница появляется на пару пикселей выше нижней границы заголовка.) * Я уже решил эту проблему самостоятельно, забыл удалить заявление calc()
ранееborder-bottom on hover issue и текстовый автоцентр
Также мне интересно, почему текст в документе td
' s автоматически центрируется по вертикали. Может быть, я что-то пропустил, пожалуйста, помогите?
* {
padding: 0;
margin: 0 auto;
}
header {
position: fixed;
width: 100%;
left: 0;
right: 0;
margin-left: 0 auto;
margin-right: 0 auto;
height: 80px;
background-color: rgb(50, 50, 50);
}
#header_container {
width: 100%;
height: 100%;
max-width: 1000px;
border: 0px solid black;
}
#menu_container {
border-collapse: collapse;
width: 100%;
height: 100%;
}
#menu_container tr {
width: 100%;
height: 100%;
}
#menu_container td {
height: 100%;
width: 25%;
text-align: center;
color: rgb(203, 207, 218);
font-family: Signika;
font-size: 30px;
}
.menuItem {
padding-top: 14px;
border: 0;
}
.menuItem:hover {
border-bottom: 1px solid blue;
}
#logo {
width: 50%;
height: auto;
}
<header>
<div id="header_container">
<table id="menu_container">
<tr>
<td>
<img id="logo" src="img/desygn%20logo%20website.png">
</td>
<td class="menuItem">Home</td>
<td class="menuItem">Over</td>
<td class="menuItem">Contact</td>
</tr>
</table>
</div>
</header>
Ваше сотрудничество де, кажется, работает для меня ... это * все * разметка? какой браузер вы используете? – ochi
Вертикальное центрирование или, вернее, выравнивание по вертикали: середина наследуется от стиля браузера по умолчанию. Но что более важно, вы действительно должны смотреть не использовать
'td' имеют 'vertical-align: center' по умолчанию, чтобы визуально выравнивать данные. Если вы хотите изменить это, вы можете, конечно. –
ответ
Логотип размер изображения тревожного сафари браузер, который был зафиксирован с
Надеется, что это решение отлично подходит для вас :)
источник
2015-04-15 17:07:26 Muhammed
Ну, это вроде работы, но не так, как я хочу. +1 для усилия, хотя, я исправляю свою проблему по-другому. – YSbakker
Я думаю, что это будет, избавившись от стола и заменив его отдельными divs. – YSbakker
Вот что я пытался сказать, он работает действительно, но я нашел альтернативный способ решить мою проблему, поэтому я не «счастлив», с вашим ответом, если вы так выразились. Однако это действительно работает, и именно поэтому я даю вам преимущество. – YSbakker
Смежные вопросы