Html 侧导航栏问题
我敢肯定我刚才犯了一个愚蠢的错误,但我似乎无法解决这个问题。 我导航中的列表项不是从div的边缘开始的,它几乎像是在左侧有一个边距 HTMLHtml 侧导航栏问题,html,css,nav,Html,Css,Nav,我敢肯定我刚才犯了一个愚蠢的错误,但我似乎无法解决这个问题。 我导航中的列表项不是从div的边缘开始的,它几乎像是在左侧有一个边距 HTML 您忘记重置浏览器的默认CSS值 默认情况下,根据浏览器的不同,在ul有一些边距和填充的情况下,会有一些属性值分配给某些元素。因此,为了解决此问题,应按如下方式重置这些值: <div class="container"> <div id="topline"> blah blah </div> <div cl
您忘记重置浏览器的默认CSS值 默认情况下,根据浏览器的不同,在
ul
有一些边距和填充的情况下,会有一些属性值分配给某些元素。因此,为了解决此问题,应按如下方式重置这些值:
<div class="container">
<div id="topline"> blah blah </div>
<div class="leftbox">
<img src="images/totalbulllogo.svg" alt="Total Bull Clothing Company Logo" />
</div>
<div id="banner">
<img src="images/totalbullbanner2.jpg" alt="Total Bull Clothing Company Logo" />
</div>
<div id="navmenu">
<ul>
<li class="active"><a href="#">HOME</a></li>
<li><a href="#">ABOUT</a></li>
<li><a href="#">STORE</a></li>
<li><a href="#">SALE ITEMS</a></li>
<li><a href="#">CONTACT</a></li>
</ul>
</div>
<div id="mainContent"> FEATURED ITEMS</div>
</div>
html, body {
margin:0;
padding:0;
font-family: Calibri, Arial, sans-serif;
}
@font-face {
font-family:'Neon 80s';
src:url('../fonts/neon.ttf'),
url('../fonts/neon.eot');
}
.container {
clear: both;
margin: 0 auto;
padding: 0;
width: 58%;
background-color: #FFFFFF;}
#topline { float:left;
text-align:right;
padding: 0;
width: 100%;
height: 5%;
background-color: #FFF;
margin-top:2%;
margin-bottom:2%;}
.leftbox {
float:left;
padding: 0;
width: 30%;
background-color: #5D2F92;}
.leftbox img {width: 96%;
margin-left: 3%
margin-right:1%;}
#banner img {width: 100%;}
#banner {float:left;
width:68%;
margin-left:2%;}
#navmenu {
float:left;
padding: 0;
width: 30%;
background-color: #5D2F92;
height: 100%;
margin-top:0.5%;
font-family:'Neon 80s';
font-size:18pt;
text-align:left;
}
#navmenu li {
list-style:none;
margin: 0;
}
#navmenu li a {text-decoration:none;
color:#FFFFFF;
margin: 0;
display:block;
padding:20px 0px;}
#navmenu li.active a {background-color:#C49A6C;}
#mainContent {float:left;
width:68%;
background-color:red;
text-align:center;
margin-top:0.5%;
margin-left:2%;}
#navmenu ul{
margin:0;
padding:0;
}