Warning: file_get_contents(/data/phpspider/zhask/data//catemap/3/html/76.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Html 侧导航栏问题_Html_Css_Nav - Fatal编程技术网

Html 侧导航栏问题

Html 侧导航栏问题,html,css,nav,Html,Css,Nav,我敢肯定我刚才犯了一个愚蠢的错误,但我似乎无法解决这个问题。 我导航中的列表项不是从div的边缘开始的,它几乎像是在左侧有一个边距 HTML 您忘记重置浏览器的默认CSS值 默认情况下,根据浏览器的不同,在ul有一些边距和填充的情况下,会有一些属性值分配给某些元素。因此,为了解决此问题,应按如下方式重置这些值: <div class="container"> <div id="topline"> blah blah </div> <div cl

我敢肯定我刚才犯了一个愚蠢的错误,但我似乎无法解决这个问题。 我导航中的列表项不是从div的边缘开始的,它几乎像是在左侧有一个边距

HTML


您忘记重置浏览器的默认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;
    }