无法将div元素更多地移动到左侧

Question

请看这个div结构：

<div class="columnbox" style="margin-top:10px;">
    <div class="paging">
        <asp:Literal ID="ltPagingBottom" runat="server" />
    </div>
</div>

这些课程：

.paging{width:650px;border:#000000 0px solid;height:20px;}

.columnbox{ background-color:#f6f6f6;border:1px solid #CCCCCC;width:96%;padding:10px;margin:0 10px 10px 0;line-height:17px;}

由于某些原因，分页按钮落在了列框框之外，我似乎无法纠正它。

我尝试在.paging类中添加属性：

margin-left:-100px; padding:0px;

我还尝试使用

更改columnbox类

padding:0px;

但这也没有帮助。我该怎么办？

Answer 1

简单 - 添加到.columnbox {display: inline-block; }

事实上，包含元素的总宽度略有偏差，但这对您来说很容易解决。您可以减少下一个/上一个按钮的宽度，或者将列盒的宽度从96％增加到98％以匹配。

Answer 2

尝试将.paging{ position: absolute }添加到css，这样元素将相对于其第一个定位（非静态）祖先元素（.columnbox）定位自身。之后用柱箱高度来调整一下。这对我有用了！

Answer 3

这样做：

将属性float:left和width:100%添加到.columnbox类

并将属性float:left添加到.paging类

Answer 4

将float:left添加到.columnbox {}