/ /ラインアップボタン - 複数の行のテキスト、ボタン - html、css

ラインアップボタン - 複数行のテキスト、ボタン - html、css

私はそれぞれ数行のhtmlページを持っていますテキストを含むボタンをクリックします。テキストの長さは異なりますが、各テキストとボタンの間にスペースを自動的に追加して、ボタンが垂直に並ぶようにしたいと思います。

例えば:

<p>Complete part one: <button id="one" type="button">One</button></p>
<p>Now fill in section two: <button id="two" type="button">Two</button></p>

次のようになります。

ここに画像の説明を入力

一方、私はそれが整列するのが好きです。

回答:

回答№1は2

あなたのCSSを追加するだけです

button{
float:right;
}

単純に「行」の幅を制限したい場合は、次のようにします。

p{
width:400px; /* or similar to limit the width */
}

回答№2の場合は0

上記のユーザーの説明に従ってボタンcssを追加することができます。しかし、他のコンテナのcssクラスを定義する方が良いでしょう

.Container{
width:200px;
}

あなたのHTMLページをこの中に入れてください。

div class = "Container">
your code here
</div>

そしてそれはもっとよく見える この 私の意見では、段落の代わりにdivタブを使って幅を定義する方が良いでしょう。