标题左侧的空格

时间：2014-09-14 19:23:24

标签： html5 css3

为什么我的页面的header和左边框之间有空格？空间用黑色象征。

继承我正在使用的CSS以及我用于标题的html：

<header class = "header-style">
     <p>Android</p>
</header>

CSS：

.header-style {
    position: fixed;
    top: 0px;
    height:50px;
    width:100%;
    margin-left: 0px;
    background: #e95644;
}

当标题位于左侧和右侧时，标题是否会自然地引入空间？

由于

P.S我忘了提到我正在使用Google Chrome！

enter image description here

4 个答案:

答案 0 :(得分：2)

<强> Playground

您是否使用任何 CSS重置 ？如果没有谷歌关于它，但在你这样做之前使用

html, body{ margin:0; }

或

* {margin:0; padding:0;}  /* Global CSS Reset */

所以基本上你需要重置浏览器默认使用的样式到Document元素：http://www.w3.org/TR/CSS2/sample.html

此外，在使用position:fixed;或position:absolute;时，您可能需要设置元素的top和left（或其他）属性。

答案 1 :(得分：1)

使用重置样式更好。在你的情况下你可以添加这样的CSS：

html, body {
    margin: 0;
    padding: 0;
}

但总的来说，最好使用reset.css，即meyerweb.com上提供的那个：http://meyerweb.com/eric/tools/css/reset/

答案 2 :(得分：0)

它在jsfiddle上工作得很好，[jsfiddle] [1]。你用什么浏览器？

[1]: http://jsfiddle.net/qfn6nco0/

答案 3 :(得分：0)

尝试

.header-style {
[..]
padding-left: 0px;
left: 0px;
}

确保您的标头不在<html>标签

以外的任何DOM元素中
相关问题
最新问题