- ベストアンサー
大文字と小文字を等間隔にできますか？
テキストボックスのフォントとラベルのフォントを全く同じ間隔で 並べたいのですが、serifフォント以外ではできません。 フォント依存に頼れない事情もあり、困っています。 スタイルシートでは、不可能なのでしょうか？ aaaa ＡＡＡＡ ← 。。、 こんな感じで大きさが違いすぎて。 自分でもまだまだ試しますが、宜しくお願いします。
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
- ベストアンサー
<html> <body> <div style="font:16px monospace">aaa</div> <input type="text" value="AAA" style="font:16px monospace"><br>
その他の回答 (1)
- abril
- ベストアンサー率69% (388/560)
> テキストボックスのフォントとラベルのフォントを全く同じ間隔で並べたい > aaaa > ＡＡＡＡ ← 。。、 こんな感じで大きさが違いすぎて。 ちょっとイメージがよくわかりかねるのですが、テキストボックスとは<input>、ラベルは<label>を使用、ということで宜しいですよね？ また、上記引用部分2-3行目のイメージであれば、<label>が<input>の先にきてブロック要素的に並ぶ、という事でしょうか？ また、 > フォント依存に頼れない事情 とは、特定のフォントを指定せずに、という条件ですよね。 上記の解釈の上で、検証してみました。 ---------------------------------------------------------------------- 【HTML】 ---------------------------------------------------------------------- <form method="post" action="#" id="hogehoge"> <label for="sample">aaaaa</label> <input class="textbox" type="text" size="40" maxlength="100" name="data" id="sample" value="AAAAA" /> </form> ---------------------------------------------------------------------- 【CSS】 ---------------------------------------------------------------------- input { font-family: monospace; font-size: 12px; } label { display: block; margin: 0 0 0.1em 0;（※bottomの値はお好みで加減を） font-family: monospace; font-size: 12px; } ※font-sizeはinputとlabelで同一でさえあればお好みのサイズでかまいません ---------------------------------------------------------------------- ANo.1の回答者同様、フォント・グループとしてmonospace（「タイプライター体」とも言われる、全てのグリフが同一幅を持ったフォント）を定義しておけば、クライアント側にインストールされているいずれかのmonospaceフォントが適用されます。 実装のイメージが異なる様であれば、補足して下さい。
お礼
丁寧な説明ありがとうざいました。 やればやるほどＣＳＳは面白いです。
お礼
まさにこれですね！ 目から鱗が落ちる思いです。 ありがとうございました。