[解決済み】ボタンを右寄せで配置する
2022-04-02 14:59:15
質問
私はこのコードを使って、ボタンを右寄せにしています。
<p align="right">
<input type="button" value="Click Me" />
</p>
しかし
<p>
タグはスペースを浪費するので、同じように
<span>
または
<div>
.
解決方法は?
どのアライメント手法を使うかは状況によって異なりますが、基本的なものは以下の通りです。
float: right;
:
<input type="button" value="Click Me" style="float: right;">
しかし、おそらくフロートをクリアしたくなるでしょうが、それは
overflow:hidden
を親コンテナで使用するか、あるいは明示的に
<div style="clear: both;"></div>
をコンテナの底に置く。
例えば http://jsfiddle.net/ambiguous/8UvVg/
フローティング要素は、通常のドキュメントの流れから外れるので、親の境界をオーバーフローして親の高さをめちゃくちゃにすることができます。
clear:both
CSSがその面倒を見ます(同様に
overflow:hidden
). 私が追加したJSFiddleの例で、フローティングとクリアがどのように動作するかを試してみてください(
overflow:hidden
ただし、最初に)。
関連
-
[解決済み】divの高さを画面の残りスペースで埋めるようにする
-
[解決済み] HTML5のlocalStorageにオブジェクトを格納する方法は?
-
[解決済み] リンクのように動作するHTMLボタンを作成する方法
-
[解決済み] HTML 5: Is it <br>, <br/>, or <br />?
-
[解決済み] XHTMLの自己完結型タグを除くオープンタグにマッチするRegEx
-
[解決済み] チェックボックスとそのラベルをクロスブラウザーで一貫して揃える方法
-
[解決済み] セレクトボックスのプレースホルダーを作成するにはどうすればよいですか?
-
[解決済み] inline/inline-block要素間のスペースを削除するにはどうすればよいですか?
-
[解決済み] Twitter Bootstrap 3を使用して列を中央に配置する
-
[解決済み] div 要素を右寄せにするには?
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み] 名前が''の無効なフォームコントロールはフォーカスされない
-
[解決済み] span with onclick event inside the tag
-
[解決済み] HTMLでSVGを使用して三日月を描画する
-
[解決済み] css画像が表示されない
-
[解決済み] HTMLファイルへのリンクは可能ですか?
-
[解決済み] :last-child が期待通りに動作しない?
-
[解決済み] 送信ボタンが機能しない
-
[解決済み] フッターの内容が重なっているのを修正するには?
-
[解決済み] divが重ならないようにするには?
-
[解決済み] フロートされた子 div の高さを親の高さに拡張するにはどうすればよいですか?