大体宽,无水平滚动条 [英] large body width without horizontal scrollbar
问题描述
我将body宽度设置为1920px,并设置相同宽度的background-image。图像是标题。因为我有更窄的包装在我的身体,如果我把标题背景头本身,标题背景的宽度是由包装的边界。
所以我把它的身体,但现在我有水平滚动条在底部,中心的页面被移动到右边。
我如何摆脱那个滚动条和中心的页面?这是代码:
I set body width to 1920px and set background-image of the same width. The image is for header. Cause I have narrower wrapper inside my body and if I put header background to header itself the header background's width is cut by wrapper's borders. So I put it to body but now I have horizontal scrollbar at the bottom and the center of the page is moved to right. How can I get rid of that scrollbar and center the page? Here is the code:
body {
background-color: #f6f6f6;
background-image: url('../img/menu-background.png');
width: 1920px;
background-repeat: no-repeat;
font-family: 'PT Sans';
}
.wrapper {
width: 950px;
min-height: 1658px;
border: 1px solid grey;
margin: 0 auto;
}
header a {
text-decoration: none;
text-align: center;
display: block;
width: 365px;
margin-left: auto;
margin-right: auto;
}
HTML:
<body>
<div class="wrapper">
<header>
<a href="#">
<h1>Lorem ipsum</h1>
<span>bla-bla-bla</span>
</a>
</header>
推荐答案
您可以通过添加
来阻止滚动条 overflow-x:hidden;
加入您的身体
You can prevent the scrollbar by adding
overflow-x:hidden;
to your body
这篇关于大体宽,无水平滚动条的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!