css - CSS フローティングの問題が新しい行にプッシュされる

Question

以下のjsfiddleの例をご覧ください。

ここで私が間違っていることを誰かが理解できますか?

jsfiddleに示されているように、この1つの側面を除いてすべて機能するSmart Wizardと呼ばれるサードパーティのプラグインを使用しようとしています。

[X] は新しい行にあり、エラーメッセージのすぐ右側にある必要があります。

score 3 · Accepted Answer

追加するだけ

.content { width: 90%; float: left; }

フィドルの例: http://jsfiddle.net/4wJv4/9/ - コンテンツ要素の幅を好みに合わせて調整します

score 1 · Accepted Answer

これをスタイルシートに追加してみてください..うまくいきました..

.swMain .msgBox .close {
    float: left;
}

要素を 1 行に配置するには、すべての要素を同じタグ内の左にフロートする必要があります。

「フロート」だけで十分です..

score 1 · Accepted Answer

コンテンツ div と閉じるアイコンをフロートする必要があります。これに加えて、テキストの直後ではなく、メッセージボックスの右側に閉じるボタンをフロートさせたい場合があります。

.swMain .msgBox .content { float:left; width:auto; }
.swMain .msgBox .close { float: right; }

これらの変更であなたのフィドルを更新しました - http://jsfiddle.net/4wJv4/19/

3 に答える 3