html - CSS 浮動小数点数の問題

Question

ページのデザインに夢中で、ヘッダーの配置に苦労しています。ここでわかるように：

「追加」が従業員リストと一致することを望みました。どうすればいいですか？

ところで、ここに html コードがあります: 私はbootstrapを使用しました。しかし、ネイティブ CSS の提案は依然として有効です。

    <div class="title">
                <h4>Employee list</h4> 
                <span class="pull-right">Add</span>
            </div>

ありがとう

Answer 1

Addを の前に移動し<h4>ます。右にフロートする場合、ターゲット要素を他の要素の前に配置する必要があります。

デモ

HTML

<div class="title">
     <span class="pull-right">Add</span>
     <h4>Employee list</h4> 
</div>

CSS

.pull-right {
    float:right;
}

Answer 2

h4 幅 auto を指定し、左にフロートします

CSS

h4
{ 
float:left;width:auto
 }

およびスパンフロート右幅自動

.pull-right
{
 float:right;width:auto
}