とても単純な修正をしたいだけなのですが、ちょっと作業が面倒かなと手を止めました。
buttonを右寄せするのに、divで囲む方法しか思いつきません。
他に何か良い方法は無いでしょうか。
(追記)
コード中、style内btn1の中身にこだわりはありません。要はbuttonが、bodyのwidth範囲で右に来てくれれば良いです。
html
1<!DOCTYPE html> 2<html lang="ja"> 3<head> 4 <meta charset="UTF-8"> 5 <title>右寄せ変更</title> 6<style> 7body { width: 640px; } 8.btn1 { 9 display: block; 10 width: 100%; 11 text-align: right; 12} 13.btnPos { 14 text-align: right; 15} 16</style> 17</head> 18<body> 19<p> 20こういうボタンについて↓ 21</p> 22<p>文章1</p> 23<button type="button" class="btn0">次へ</button> 24<p>文章2</p> 25<button type="button" class="btn0">次へ</button> 26<p> 27ボタンは右寄せで配置したいのに、 28ビローンと伸びたボタンになってしまう。↓ 29</p> 30<p>文章1</p> 31<button type="button" class="btn1">次へ</button> 32<p>文章2</p> 33<button type="button" class="btn1">次へ</button> 34<p> 35divで囲めば出来ることは分かっていますが↓ 36</p> 37<p>文章1</p> 38<div class="btnPos"> 39 <button type="button" class="btn2">次へ</button> 40</div> 41<p>文章2</p> 42<div class="btnPos"> 43 <button type="button" class="btn2">次へ</button> 44</div> 45<p> 46できればスタイルシートbtnの変更だけで済むと助かるのですけど・・・ 47</p> 48</body> 49</html> 50
使用ブラウザはChrome最新です。
回答2件