html - CSS Contain input text to 100% width -



html - CSS Contain input text to 100% width -

so when set input illustration text box, because has border , padding default, wider 200px.

<div style="width:200px; background-color:red;"> <input type="text" name="fname" style="width:100%;"/> </div>

i know can forcefulness text box fit within 200px setting class input tag , tagging css

-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;

is there improve way texbox size correctly, i.e. fill 100% want do? cannot utilize fixed sizes. using css themes text box padding, margins, etc not known @ compile time. can changed out user on fly. solution must work regardless of textbox's padding, border, , margin is.

i think have answered own question. box-sizing: border-box; css means of getting element fit within parent. css-tricks goes great detail here.

http://css-tricks.com/box-sizing/

i unaware of other css utilize other using javascript perform calculations , modifying input elements.

html css

Comments

Popular posts from this blog

delphi - blogger via idHTTP : error 400 bad request -

c++ - compiler errors when initializing EXPECT_CALL with function which has program_options::variables_map as parameter -

How do I check if an insert was successful with MySQLdb in Python? -