我想做的事情,我认为非常简单.我正在构建的网站的标题是一种纯色,需要跨越屏幕的整个宽度,无论它被浏览的是哪个浏览器.到目前为止,我创建的内容在台式机和笔记本电脑上都很棒,但是当我测试它时平板电脑或手机,标题不会一直向右.标题内的内容确实跨越了一切,这对我来说真的很困惑.我可以让标题栏跨越整个宽度的唯一方法是将position属性设置为static,这不是我对此站点所需要的,所以这对我没有任何帮助.下面是我正在使用的CSS和HTML.有人可以看看它,让我知道我错过了什么.
HTML:
<div class="header">
<div class="container">
<div class="header-content">
....Some Content goes in here....
</div> <!-- /.header-container -->
</div> <!-- /.container -->
</div> <!-- /.header -->
Run Code Online (Sandbox Code Playgroud)
CSS:
html, body {
background-color: #949494;
width: 100%;
margin: 0px;
padding: 0px;
}
.header {
width: 100%;
min-width: 100%;
height: 200px;
background-color: #ffffff;
padding-top: 8px;
}
.container {
width: 1200px;
margin: 0 auto;
text-align: center;
}
Run Code Online (Sandbox Code Playgroud)