1. ホーム
  2. twitter-bootstrap

[解決済み] Twitter Bootstrapのボタンを右寄せにするにはどうしたらいいですか?

2022-03-20 22:52:31

質問

簡単なデモがあります。

<ul>
    <li>One <input class="btn pull-right" value="test"></li>
    <li>Two <input class="btn pull-right" value="test2"></li>
</ul>

順不同のリストがあり、各リストの項目に対して、左にテキスト、右に配置されたボタンを表示したいと思います。 プルライトを使用しようとしましたが、これは完全に整列を台無しにします。 私は何を間違えているのでしょうか?

<link href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css" rel="stylesheet" />
<ul>
  <li>One <input class="btn pull-right" value="test"></li>
  <li>Two <input class="btn  pull-right" value="test2" </li>
</ul>

解決方法は?

挿入 pull-right をclass属性に追加して、bootstrapにボタンを配置させます。

について ブートストラップ2.3 をご覧ください。 http://getbootstrap.com/2.3.2/components.html#misc ヘルパークラス > .pull-right.

について ブートストラップ3 をご覧ください。 https://getbootstrap.com/docs/3.3/css/#helper-classes >ヘルパークラスです。


について Bootstrap 4 をご覧ください。 https://getbootstrap.com/docs/4.0/utilities/float/#responsive

pull-right コマンドは削除され、代わりに float-right または一般的に float-{sm,md,lg,xl}-{left,right,none}