HTML+CSSの印刷に関する質問です。

質問

HTML+CSSの印刷に関する質問です。
テキストボックスのサイズ内に収まりきらない文字を入力している場合、印刷時に入力
した文字が切れてしまうのですが、印刷時だけ自動的に拡張するといったことは可能で
しょうか。

　　<input class="text" size="20" type="text" />

このような感じでテキストボックスを設置してるんですが、size=20を超えて入力した文
字が印刷時に切れてしまいます。
ご回答よろしくお願い致します。

回答No.1

ORUKA1951 · ベストアンサー

このときは、mediaがプリントの場合に、width:auto;かoverflow:visibleなどを指定します。
このページが、印刷を想定しているなら、当然ですが、画面表示--media:screenと、印刷表示--media:plintは異なるスタイルシートのほうが良いのですから、基本は印刷用スタイルシートを用意することになると思います。
　その場合、width:やoverflow:は、当然ですが、非置換インライン要素は元々内容によって伸縮するため、ブロック要素にのみ適用されます。
　そのため、インライン要素であるinput要素をブロック要素に指定しなおしてから、幅を指定してください。

お礼

お返事ありがとうございました。参考にさせていただきます。