Javascript div浮动在转盘顶部时出现问题
我正在使用,但我的页面上有一个奇怪的错误,我想不出来!基本上,我正在尝试在旋转木马的顶部覆盖一个Javascript div浮动在转盘顶部时出现问题,javascript,css,Javascript,Css,我正在使用,但我的页面上有一个奇怪的错误,我想不出来!基本上,我正在尝试在旋转木马的顶部覆盖一个 当我把放在顶部时,旋转木马顶部会弹出一个奇怪的缺口!我不知道它是从哪里来的。它在JavaScript中吗 黑匣子,我可以稍后格式化。只需要知道为什么会出现空白 HTML 如果你说的是顶部的20px白线,那是来自.jcarousel wrapper的边距:20px auto 只需将20px更改为0px,或者添加一个新行覆盖页边距顶部,如果您想保留底部页边距: .jcarousel-wrapper {
当我把
放在顶部时,旋转木马顶部会弹出一个奇怪的缺口!我不知道它是从哪里来的。它在JavaScript中吗
黑匣子,我可以稍后格式化。只需要知道为什么会出现空白
HTML
如果你说的是顶部的20px
白线,那是来自.jcarousel wrapper
的边距:20px auto代码>
只需将20px
更改为0px
,或者添加一个新行覆盖页边距顶部
,如果您想保留底部页边距:
.jcarousel-wrapper {
margin: 20px auto;
margin-top: 0px;
}
你说的是哪一个div,空白到底出现在哪里?
#login-carousel-wrapper {
width: 850px;
height: 500px;
margin: 0px auto;
}
#login-carousel-area {
background-color: #000;
z-index: 999;
width: 200px;
height: 200px;
position: relative;
top: 200px;
left: 100px;
}
#body-wrapper {
width: 970px;
height: 100%;
margin: 0px auto;
text-align: top;
}
.carousel-wrapper {
max-width: 850px;
/*padding: 0 20px 40px 20px;*/
margin: auto;
}
.jcarousel-wrapper {
margin: 20px auto;
position: relative;
border: 10px solid #fff;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
-webkit-box-shadow: 0 0 2px #999;
-moz-box-shadow: 0 0 2px #999;
box-shadow: 0 0 2px #999;
}
.jcarousel-wrapper .photo-credits {
position: absolute;
right: 15px;
bottom: 0;
font-size: 13px;
color: #fff;
text-shadow: 0 0 1px rgba(0, 0, 0, 0.85);
opacity: .66;
}
.jcarousel-wrapper .photo-credits a {
color: #fff;
}
/** Carousel **/
.jcarousel {
position: relative;
overflow: hidden;
width: 850px;
height: 500px;
}
.jcarousel ul {
width: 20000em;
position: relative;
list-style: none;
margin: 0;
padding: 0;
}
.jcarousel li {
float: left;
}
/** Carousel Controls **/
.jcarousel-control-prev, .jcarousel-control-next {
position: absolute;
top: 200px;
width: 30px;
height: 30px;
text-align: center;
background: #4E443C;
color: #fff;
text-decoration: none;
text-shadow: 0 0 1px #000;
font: 24px/27px Arial, sans-serif;
-webkit-border-radius: 30px;
-moz-border-radius: 30px;
border-radius: 30px;
-webkit-box-shadow: 0 0 2px #999;
-moz-box-shadow: 0 0 2px #999;
box-shadow: 0 0 2px #999;
}
.jcarousel-control-prev {
left: -50px;
}
.jcarousel-control-next {
right: -50px;
}
.jcarousel-control-prev:hover span, .jcarousel-control-next:hover span {
display: block;
}
.jcarousel-control-prev.inactive, .jcarousel-control-next.inactive {
opacity: .5;
cursor: default;
}
/** Carousel Pagination **/
.jcarousel-pagination {
position: absolute;
bottom: 0;
left: 15px;
}
.jcarousel-pagination a {
text-decoration: none;
display: inline-block;
font-size: 11px;
line-height: 14px;
min-width: 14px;
background: #fff;
color: #4E443C;
border-radius: 14px;
padding: 3px;
text-align: center;
margin-right: 2px;
opacity: .75;
}
.jcarousel-pagination a.active {
background: #4E443C;
color: #fff;
opacity: 1;
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.75);
}
.jcarousel-wrapper {
margin: 20px auto;
margin-top: 0px;
}