html - Vertical form with CSS -


how make inputs same width 100%?

if set width 100% input break on new line:

div > input {     width: 100%;  } 

html:

<div class="wrapper">     <div>         <label>label</label>         <input type="text" />     </div>     <div>         <label>label</label>         <input type="text" />     </div>     <div>         <label>label</label>         <input type="text" />     </div>   </div> 

css:

.wrapper label {     float: left;     margin-right: 10px; } .wrapper div {     margin-bottom: 15px; } 

the desired result (jsfiddle):

screenshot

.wrapper input {     width: 90%; } 

you cannot make 100% without new line because label take space of screen. remaining portion can allot text fields.


Comments

Popular posts from this blog

javascript - Jquery show_hide, what to add in order to make the page scroll to the bottom of the hidden field once button is clicked -

javascript - Highcharts multi-color line -

javascript - Enter key does not work in search box -