文本对齐不在同一行

Question

我是新手我不太了解代码。我想在一个块的左侧有一个链接，在右侧有另一个链接。我正在使用以下命令。两者都是正确的一面，但新的一面。我在css中给出了正确的代码，但我认为有些HTML代码问题。请让我知道下面的错误。

       <div class="more">
       <span><a href="http://www.fe.com/discuss">See More</a></span>
       </div>
       <div class="placeadhere">
       <span><a href="http://www.fe.com/posting.php?mode=post&f=16">Place Ad Here</a></span>
       </div>

我的CSS是

.more {
font-size:11px;
text-align:right;
margin:5px 0 10px 0;

}

.placeadhere {
font-size:11px;
text-align:left;
margin:5px 0 10px 0;

}

图像是

非常感谢你的问题解决了你的答案...爱你和你的... ...

Answer 1

我认为问题是你的问题。你也应该粘贴它。

<div class="more" style="width:auto; float: left;">
       <span><a href="http://www.fedri.com/discuss">See More</a></span>
</div>
<div class="placeadhere" style="width:auto; float: right;">
       <span><a href="http://www.fedri.com/posting.php?mode=post&f=16">Place Ad Here</a></span>
</div>

Answer 2

Div是块元素，占据整个宽度。将div指定为内嵌，以便仅占用所需的宽度。或者你可以将div的位置设置为绝对值，并根据需要浮动它们。

.more {
 display: inline;
    float: left;
    font-size: 11px;
    margin: 5px 0 10px;
    text-align: right;
}

.placeadhere {
 display: inline;
    float: right;
    font-size: 11px;
    margin: 5px 0 10px;
    text-align: left;
}

查看工作小提琴 - http://jsfiddle.net/bkgJT/

Answer 3

您可以在http://cssdeck.com/labs/tztgz6hy/0

工作时看到这一点

我在整个HTML片段周围添加了一个额外的div，它应该看起来像

<div class="main">
    <div class="more">
        <span>
            <a href="http://www.fedri.com/discuss">See More</a>
        </span>
    </div>
    <div class="placeadhere">
        <span>
            <a href="http://www.fedri.com/posting.php?mode=post&f=16">Place Ad Here</a>
        </span>
    </div>
</div>

和CSS

.more {
font-size:11px;
text-align:right;
margin:5px 0 10px 0;
}
.placeadhere {
font-size:11px;
text-align:left;
margin:5px 0 10px 0;
}
.main .more{float:left;}
.main .placeadhere{float:right;}

Answer 4

使用此方法自定义div宽度

<div style="width:somevalue">
        <div class="more">
         <span><a href="http://www.fedri.com/discuss">See More</a></span>
       </div>
       <div class="placeadhere" style="float:right;">
        <span><a href="http://www.fedri.com/posting.php?mode=post&f=16">Place Ad Here</a></span>
       </div>
   </div>

Answer 5

只需添加float

即可

.more {
font-size:11px;
text-align:right;
margin:5px 0 10px 0; float:right
}

.placeadhere {
font-size:11px;
text-align:left;
margin:5px 0 10px 0; float:left
}​

<强> DEMO