0

我在 Rails 应用程序中添加了轮播。在 Firefox 中运行良好。但是当我看到chrome时，我才知道“下一步”按钮的位置已经改变了。直到现在我还没有找到任何解决方法。

以下是所有轮播的css

.proposal-section .carousel-previous {
  background: url("/assets//previous.png") no-repeat scroll 0 0 transparent;
  position: absolute;
  margin-left: 3px;
  margin-top: 70px;
  z-index: 1000;
}

Chrome 在页面的最左侧显示具有此属性值的下一个按钮，“margin-left：-35;”，但 ff 很好。ff 在 "margin-left: 950;" 上显示此按钮不在视图中（在右侧）但铬很好。我该如何解决 。

.proposal-section .carousel-next {
  background: url("/assets//next.png") no-repeat scroll 0 0 transparent;
  position: absolute;
  margin-left: -35px;
  margin-top: 71px;
}

.proposal-section .carousel-control {
  overflow:hidden;
  display:inline-block;
  vertical-align:middle;
  width:30px;
  height:32px;
  cursor:pointer;
  line-height:999px;
  zoom:1;
  border:0;
  text-indent:-9999px;
}

.proposal-section .carousel-control:hover {
  -moz-opacity:.7;
  opacity:0.70;
  filter:alpha(opacity=70);
}

.proposal-section .carousel-wrap {
  display: inline-block;
  vertical-align: middle;
  width: 99%;
  border: 3px solid #473161;
  border-radius: 5px;
  height: 174px !important
}
4

1 回答 1

1

试试这个，它会在两个浏览器中制作按钮（可能是所有的）：

.proposal-section .carousel-control {
  overflow:hidden;
  display:inline-block;
  vertical-align:middle;
  width:30px;
  height:32px;
  cursor:pointer;
  line-height:999px;
  zoom:1;
  border:0;
  text-indent:-9999px;
}

.proposal-section .carousel-control:hover {
  -moz-opacity:.7;
  opacity:0.70;
  filter:alpha(opacity=70);
}

.proposal-section .carousel-wrap {
  display: inline-block;
  vertical-align: middle;
  width: 99%;
  border-radius: 5px;
  height: 174px !important
}

.proposal-section .carousel-next {
  background: url("/assets//next.png") no-repeat scroll 0 0 transparent;
  position: absolute;
  margin-left: 5px;
  margin-top: 65px;
  height: 45px;
  width: 23px;
  opacity:0.4;
  filter:alpha(opacity=40);
  -moz-opacity: .4;
}

.proposal-section .carousel-previous {
  background: url("/assets//prev.png") no-repeat scroll 0 0 transparent;
  position: absolute;
  margin-left: -10px;
  margin-top: 65px;
  height: 45px;
  width: 23px;
  z-index: 1000;
  opacity:0.4;
  filter:alpha(opacity=40);
  -moz-opacity: .4;
}
于 2012-12-11T11:19:42.690 回答