[英]adding a shadow border to my wrapper
I have a #wrapper
, which contains all page content, and I'd like to place another div around it with a shadow border, #shadowwrap
. 我有一个#wrapper
,其中包含所有页面内容,并且我想在其周围放置另一个带有阴影边框的div #shadowwrap
。 I've been staring at this stuff for way to long today, and my brain's stuck... 直到今天,我一直在盯着这些东西,但我的大脑被卡住了...
#shadowwrap {
background:url("images/shadowborder.png") repeat-y center;
background-color:transparent;
max-width:1000px;
min-width:1000px;
min-height:100%;
margin:0 auto;
position:relative;
}
#wrapper {
background-color:#FFF;
width:100%;
max-width:980px;
min-width:980px;
min-height:100%!important;
margin:0 auto;
margin-bottom:-50px;
position:relative;
overflow:auto;
}
site: http://www.hcfmissoula.com 网站: http : //www.hcfmissoula.com
Thanks. 谢谢。
You could make your life a lot easier by just applying the shadow to the #wrapper
element like so: 只需将阴影应用于#wrapper
元素,就可以使您的生活变得更加轻松:
#wrapper {
/* shadowborder.png should be 1000px wide (10px of shadow on either side and
980px of white to create the solid background colour) */
background: url("images/shadowborder.png") repeat-y 0 0;
/* The 10px of left and right padding + 980px of width will result in a
1000px wide #wrapper */
padding: 0 10px;
width: 980px;
/* remaining CSS. I removed min-width and max-width because they were
both the same value and therefore didn't do much ;) */
min-height: 100% !important;
margin: 0 auto;
margin-bottom: -50px;
position: relative;
overflow: auto;
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.