css - How to vertically center divs? -


i'm trying make small username , password input box.

i ask, how vertically align div?

what have is:

<div id="login" class="blackstrip floatright">    <div id="username" class="floatleft">username<br>password</div>    <div id="form" class="floatleft">    <form action="" method="post">       <input type="text" border="0"><br>       <input type="password" border="0">    </form>    </div> </div> 

how can make div id username , form vertically align center? i've tried put:

vertical-align: middle; 

in css div id login, doesn't seem work. appreciated.

the best approach in modern browsers use flexbox:

#login {     display: flex;     align-items: center; } 

some browsers need vendor prefixes. older browsers without flexbox support (e.g. ie 9 , lower), you'll need implement fallback solution using 1 of older methods.

recommended reading


Comments

Popular posts from this blog

javascript - Enclosure Memory Copies -

php - Replacing tags in braces, even nested tags, with regex -