ホームページ >ウェブフロントエンド >htmlチュートリアル >高さ 100% の td の入力の実際の高さは異なります。 _html/css_WEB-ITnose
高さ 100% の td の入力の実際の高さは異なります。 _html/css_WEB-ITnose
- WBOYオリジナル
- 2016-06-24 11:50:152275ブラウズ
まず私の意図を言わせてください。
td に入力を配置し、この入力の高さを 100% に設定しました。
この入力を TD の高さに適応させたいので、入力の高さを固定ピクセルに設定したくありません。
適応に問題はありません。 td の高さが増加すると、それに応じて入力の高さも増加します。
しかし、問題はブラウザが異なることです。入力の実際の高さは同じではありません。 chrom、opera、safriはboxモデルに準拠していないらしく、高さがfirefoxと一致しません。
うーん、
私の質問は次のとおりです:
入力を固定の高さに設定する代わりに、Firefox と Chrome で入力の実際の高さを同じにするにはどうすればよいですか?
ディスカッションへの返信 (解決策)
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">不同浏览器下，input的高度不同<table style="width: 100px; height: 40px;" border="0" cellpadding="0" cellspacing="0"><tbody style="height: 40px;"><tr style="height: 40px;"> <td style="height: 40px;" valign="middle"> <input name="title" style="width: 100%; height: 100%;border:5px solid blue;padding:5px;background-color:transparent;"> </td></tr></tbody></table>
ボックス モデルをよく理解してください
上の階の回答ありがとうございますが、それでも入力のパディングとボーダー幅を保持したいと考えています。
この問題を解決するために、入力の外側の層に div を追加しました。
リーリー
声明：
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。