Question

我正试图在我的旋转木马的右下角重新定位左右旋转木马按钮控件。但是，我无法弄清楚如何浮动左控件，因为没有浮动右边？

初始页面加载：

enter image description here

将页面拖得更宽：

enter image description here

Float不包含在代码中，但我尝试了浮动：右边是左控件。

<a class="left carousel-control" href="#mainCarousel" data-slide="prev"  style="margin: 348px 0 0 770px">&lsaquo;</a>   
<a class="right carousel-control" href="#mainCarousel" data-slide="next"   style="margin: 348px -20px 0 0">&rsaquo;</a>

我已经尝试将两者都放在一个div中并且向右浮动但是没有去。

我基本上希望两个旋转木马按钮在旋转木马的右下方保持紧挨着。在页面加载时，我的边距将下一个/上一个按钮重新定位到右下角部分，最初它们一起显示但是当您向右拖动浏览器时，它会加宽/拉伸控件并将控件分开（右移但左边保持固定）。这里是JSFIDDLE - ＆gt; http://jsfiddle.net/LneL8/

Answer 1

这是你想要做的。我拿出边缘例如清酒。 http://jsfiddle.net/ZS4KR/

 <div id="buttons">
    <p class="floatLeft"><a class="left carousel-control" href="#mainCarousel" data-slide="prev">Left</a> </p>

    <p class="floatRight"><a class="right carousel-control" href="#mainCarousel" data-slide="next">Right</a></p>
    </div>

CSS

.floatRight{
    float:right;
}
.floatLeft{
    float:left;
}

修改

我更新了你的小提琴http://jsfiddle.net/LneL8/1/

Answer 2

您是否试图将它们放在页面的两侧？

我看着你的jsFiddle，却看不到箭头。

但是假设您的箭头HTML代码是这样的：

<input type="button" class="leftArrow" value="left" />
<input type="button" class="rightArrow" value="right" />

要使左箭头向左“浮动”而右箭头向右“浮动”，请添加以下CSS：

.leftArrow { position: relative; float: left; }
.rightArrow { position: relative: float: right; }

请记住：使职位“相对”很重要。否则浮动将不起作用。

如何漂浮左旋转木马左控制？

2 个答案: