html - CSS 对象未占用 100% 的宽度

标签 html css

大约 9 年后,我重新开始网络编程。变化太大了!

我在我的网站上取得了一些进展,但有一件事真的让我很恼火。我遵循了屏幕顶部静态标题的教程。 http://www.cssreset.com/creating-fixed-headers-with-css/

这很简单,但是我穿过屏幕的那条线(通过在标题类中设置 bottom-border)并没有一直到左边。看起来它还有几个像素要走。相比之下,右侧似乎还不错。

非常简单,简单

.header {
    width: 100%;
    position: fixed;
    top: 0px;
    height: 30px;
    background: #FFFFFF;
    border-bottom: 1px solid #C0C0C0;
    margin: 0 auto;
    vertical-align: middle;
    z-index: 1000;
}

您可以在此处查看正在运行的页面: http://onfilm.us/image_index.html

最佳答案

将您的 body 边距设置为零。默认情况下浏览器有一个非零值,这就是导致它的原因。

body {
  margin: 0;
}

您可能需要考虑使用 reset.css 将边距和填充等归零,从而避免这些问题。这是一个链接到其中一堆的网站:http://www.cssreset.com/

关于html - CSS 对象未占用 100% 的宽度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26206172/

相关文章:

javascript - 如何删除 'back'按钮/如何保留后退按钮

javascript - 数字按正确顺序显示按钮

html - 是什么导致我的页面溢出?

CSS Repeat-x 但只是图像中我想要的一部分

html - 按钮在页面加载时显示在上方

html - Rmarkdown HTML 模板产生 pandoc 错误 61

JQuery 工具提示 : Target Span inside title attribute

javascript - 使用 JavaScript 有条件地打开表单提交页面

html - IE8 z-index 和 body 不兼容 :after

html - 无法使 Bootstrap 表变小