HTML列表-宽度问题_Html_Css_Width_Margin_Padding

HTML列表-宽度问题

html css

HTML列表-宽度问题,html,css,width,margin,padding,Html,Css,Width,Margin,Padding,我想征求你们的意见。我有一个类似CSS的HTML文件，一切都很好，但是当我在本地主机上打开这个“站点”时，列表的宽度比我定义的要大。我没看到什么不好的。你能看一下并告诉他们发生了什么事吗我的HTML文件： <!DOCTYPE html> <html lang="sk"> <head> <link href="scripts/google_analytics.js"> <link href="scripts/facebo

我想征求你们的意见。我有一个类似CSS的HTML文件，一切都很好，但是当我在本地主机上打开这个“站点”时，

列表的宽度比我定义的要大。我没看到什么不好的。你能看一下并告诉他们发生了什么事吗
我的HTML文件：
<!DOCTYPE html>
 <html lang="sk">
  <head>
    <link href="scripts/google_analytics.js">
    <link href="scripts/facebook.js">
    <link href="scripts/font_Alef.js">
    <link href="scripts/font_Playfair.js">
    <link rel="shortcut icon" type="image/x-icon" href="templates/favicon.ico">
    <link rel="stylesheet" href="styles/index.css">
    <link rel="stylesheet" href="styles/media_queries.css">
            <meta charset="utf-8">
  </head>
  <body class="body">
    <header class="header">
        <img src="templates/logo.png">
        <ul>
            <li><a href="#">Niečo</a></li>
            <li><a href="#">NIEČO</a></li>
            <li><a href="#">NIEČO</a></li>
            <li><a href="#">NIEČO</a></li>
            <li><a href="#">NIEČO</a></li>
        </ul>   
    </header>
    <content class="content">
    </content>
    <footer class="footer">niečo
    </footer>
  </body>
 </html>    

默认情况下，标签有一个填充值。


在css中设置padding:0
，以解决此问题

默认情况下，标签有一个填充值。


在css中设置padding:0
，以解决此问题

哦，天哪，谢谢你。。我还以为是虫子呢。我会在10分钟内接受你的回答并投票赞成；）这不是一个bug，有些标签，比如ul和p，有一个预设的填充值和/或边距。哦，天哪，谢谢。。我还以为是虫子呢。我会在10分钟内接受你的回答并投票赞成；）这不是一个bug，一些标签如ul和p有一个预设的padding和/或margin值。
body {
font-family: "Myriad Pro";
width: 960px;
height: auto;
margin: 0 auto;
    }

header {
width: 960px;
height: auto;
display: block;
font-family: 'Alef', sans-serif;
font-weight: bold;
text-align: center;
    }   

header img {
width: 480px;
height: auto;
float: left;
    }

header ul {
float: left;
width: 960px;
background-color: #EEE;
border-radius: 3px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
    }

header ul li {
  float: left;
 width: 192px;
 display: inline-block;
 list-style: none;
 text-align: center;
 border-radius: 3px;
 -moz-border-radius: 3px;
 -webkit-border-radius: 3px;
 height: 40px;
    }

a {
 text-decoration: none;
color: #ED1C25;
    }

content {
float: left;
width: 940px;
background-color: #686868;
    height: auto;
border-radius: 3px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
display: block;
padding: 10px;
margin-bottom: 10px;
    }

 footer {
float: left;
width: 960px;
background-color: #ED1C25;
height: auto;   
display: block;
height: 50px;
border-radius: 3px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
    }

header ul {
    padding:0; /* added */
    float: left;
    width: 100%;
    background-color: #EEE;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
}