Home/ Questions/Q 9248817
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-18T10:02:13+00:00

I am trying to set the width 100% on text box but it stretches

  • 0

I am trying to set the width 100% on text box but it stretches out the container.. I have checked some questions of the similar kind but there seems no explanation as to why the problem happens.. I know to manually set the properties but I need to find out why this happens. and I am must do it using the 100% property value..

   <body>
     <form id="form1" runat="server">
        <div style="border:1px solid gray;">
            <input type="text" style="width: 100%;"  id="title"/>

        </div>

    <div>
    <a href="#" id="postfile" style="float:left;">Post</a><span style="display:none;  border:1px solid #ee1100; margin-left:10px; color:#cc1100" id="errormessage"></span>
    </div>

</form>

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Try using Box sizing on your input

    <input type="text" style="width: 100%; box-sizing: border-box;"  id="title"/>

    Also the most cross browser way is :

    <input type="text" style="width: 100%; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;"  id="title"/>

    http://jsfiddle.net/zQXXh/

    • 0