0
リンク上にマウスを置いたときにナビゲーションバーを完全にハイライト表示させようとしていますが、現在は水平方向にしか動きません。私はその何かが本当に小さいと思っています。間違っていて、4時間頑張っています。私が持っているHERESにコード：HTML/CSSヘルプをリンク全体に塗りつぶす
html, body {
/*require html and body 100% height and width to allow other child elements to use percentages*/
\t height: 100%;
\t width: 100%;
\t margin: 0;
}
a {
\t text-decoration: none;
\t display: block;
\t color: black;
}
li {
\t list-style: none;
}
div{
\t margin-left: 2.5%;
\t margin-right: 2.5%;
\t margin-top: 1%;
\t border: 1px solid black;
}
.content_section{
\t height: 150%;
\t margin-bottom: 1%;
}
#footer{
\t height: 25%;
\t margin-bottom: 1%;
}
#banner{
\t margin-top: 2.5%;
\t height: 15%;
\t position: relative;
}
#banner img{
\t width: 100%;
\t height: 100%;
}
#navbar{
\t padding: 0;
\t height: 5%;
\t
text-align: center;
\t position: relative;
\t background-color: #FFCB3D;
}
#navbar li a {
\t display: block;
text-align: center;
text-decoration: none;
width: 20%;
height: 100%;
float: left;
}
#navbar ul a:hover{
\t height: 100%;
\t background-color: #FFF17C;
}<!DOCTYPE html>
<html>
\t <head>
\t \t <title>Sample Site</title>
\t \t <link rel="stylesheet" type="text/css" href="css.css">
\t </head>
\t <body>
\t \t <div id="banner">
\t \t \t <img src="resources/images/banner-image.png"> \t \t
\t \t </div>
\t \t <div id="navbar">
\t \t \t <ul id="navbar">
\t \t \t \t <li><a href="#">Page A</a></li>
\t \t \t \t <li><a href="#">Page B</a></li>
\t \t \t \t <li><a href="#">Page C</a></li>
\t \t \t \t <li><a href="#">Page D</a></li>
\t \t \t \t <li><a href="#">Page E</a></li>
\t \t \t </ul>
\t \t </div>
\t \t <div class="content_section">
\t \t </div>
\t \t <div id="footer">
\t \t </div>
\t </body>
</html>
あなたは歓迎しているので、多くの –
@MMougをありがとう:) –