Question

我有以下代码。我想让<a>水平相互跟随，但现在它们只是相互低于一致。有没有办法可以让它们一个接一个地横向移动？

<div class="sidebar_content">
        <div class="sidebar_question">
                <div>
                    <a class="q" href="1" title="Go to queue 1" >1</a>

                </div>
                <div>
                    <a class="q" href="2" title="Go to queue 2" >2</a>
                </div>
                <div>
                    <a class="q" href="3" title="Go to queue 3" >3</a>
                </div>
        </div>

    </div>

和

.sidebar_q   { xpadding-bottom:2px; display:inline; float: left; }
.sidebar_q div  {     float: lef; padding:5px;
                          -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px; }

.sidebar_q a { padding:15px; color:blue;  text-decoration: none;
    border: 2px solid #666;
    background: #ddd;
    xpadding: 2px;
    xmargin: 1px;
    color: #000;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    cursor: pointer;
}

我做了这个fiddle

Answer 1

.sidebar_q div  {     float: lef; // <-- YOUR ARE MISSING THE t from left

您在http://jsfiddle.net/gaby/CTzqU/1/

的更新小提琴

Answer 2

也许改变：

.sidebar_q div  {     float: lef; padding:5px;

到

.sidebar_q div  {     float: left; padding:5px;

Answer 3

div的默认显示属性设置为“block”。因此，如果您没有为“div”指定任何设置，就好像您将其设置为display：block。这意味着每个div都会垂直设置，就像你现在看到的那样。

使它们水平显示的方法是使用<span>而不是内部的div，或者将display：修改为display：inline。

我如何让我的DIV流动？

3 个答案: