页面为http://conmifianza.com。调整页面大小时,不会显示水平滚动条。
CSS:
@charset "utf-8";
/* CSS Document */
html,body,div,span,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,q,s,strong,sub,sup,tt,var,b,u,i,center,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,footer,header,menu,section{border:0;font-size:100%;font:inherit;vertical-align:baseline;margin:0;padding:0}article,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}table{border-collapse:collapse;border-spacing:0}
.clearfix:after {
visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0;
}
* html .clearfix { zoom: 1; } /* IE6 */
*:first-child+html .clearfix { zoom: 1; } /* IE7 */
html{
height:100%;
}
body{
color: white;
font-family: nexa_regular;
margin:0px;
padding:0px;
background:url("../img/fondo.jpg") transparent no-repeat;
-webkit-background-size:cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size:cover;
height:100%;
}
.All{
width:100%;
height:auto;
min-height:100%;
position:relative;
}
.Head{
position:relative;
width: 1001px;
height:120px;
margin: 40px auto 33px;
margin-bottom:0px;
margin-top:.7%;
/*background-color:#00F;*/
}
#Logo{
width:120px;
height:120px;
float:left;
/*background-color:#090;*/
}
#content{
position: relative;
width: 1000px;
margin: 40px auto 33px;
margin-top:.7%;
margin-bottom:10px;
overflow:hidden;
}
#titulo{
position: absolute;
right: 0px;
bottom: 0px;
width: 384px;
height: auto;
font-size:21px;
text-align:right;
color:red;
}
#contbody{
width: 100%;
height: 355px;
position: relative;
overflow:hidden;
font-family:calibri;
}
#cont_slider{
position:relative;
width:100%;
height:355px;
overflow:hidden;
}
/*.somos{
background-image:url(../img/quienessomos/banner_01.jpg);
background-position: 50% 50%;
background-repeat: no-repeat no-repeat;
}*/
#image1{
position:absolute;
background-color:rgba(255,255,255,.7);
top:39px;
left:20px;
width:200px;
height:100px;
z-index:999;
}
#contfoot{
position:relative;
width: 100%;
height: 145px;
padding-bottom:30px;
}
#menu{
width: 100%;
height: 145px;
position: relative;
/*background: url('') transparent center no-repeat;*/
border:none;
}
#socmed{
width: 24px;
height: 58px;
position: absolute;
right: -30px;
bottom: 0px;
/*background: url('') transparent center no-repeat;*/
}
.menuitem{
overflow:hidden;
width: 125px;
height: 145px;
float: left;
cursor: pointer;
}
答案 0 :(得分:3)
在overflow: hidden;
属性上设置.All
非常简单。 overflow: hidden;
会隐藏当前视图之外的任何内容。
将您的.All
代码更改为:
.All {
width: 100%;
height: auto;
min-height: 100%;
position: relative;
}
这是改变:
.All {
width: 100%;
height: auto;
min-height: 100%;
position: relative;
/*overflow: hidden; Remove this */
}
答案 1 :(得分:0)
将css中的min-width
设置为正文将完成此任务。
min-width
CSS属性用于设置给定元素的最小宽度。它阻止了width
属性的使用值变得小于为其指定的值min-width
。
因此,无论您将min-width
设置为1000px,只要窗口小于1000px,滚动条就会出现。
来源:https://developer.mozilla.org/en-US/docs/Web/CSS/min-width