How to resize HTML text fields in relation to page size?

I am obsessed with how to resize two text fields while compressing a page? Therefore, when someone drags the page from the side, the two boxes also begin to shrink (if that makes sense). Please, could you help me?

Here is my code: http://jsfiddle.net/xiiJaMiiE/3nQue/

.homeform {
position:relative;
width:20%;
}

Thanks in advance!

+3
source share
3 answers

You need to select input elements if you want to adjust its size

.homeform input[type="email"], .homeform input[type="password"] {
    position:relative;
    width:50%;
}

if you want the submit button to be changed as well, you can simply shorten the above to the next

.homeform input {
    position:relative;
    width:50%;
}

which will resize all input elements in elements with an attribute class="homeform".

. , - , . (: min-width )

+2
.homeform { width: 100%; }
input[type="text"] { width: 100%; box-sizing:border-box }

.

, ; , .

0

.homeformis the divone containing the tags input. You have to put the style in input.

.homeform input{
   width: 20%:
}
0
source

All Articles