#tabtext, #tabtextie{ position: fixed; text-transform: uppercase; padding: 5px; border-radius: 25px 25px 0 0; color: #ccc; background-color: #242424; text-align: center; cursor: pointer; } #tabtext{ height: 20px; width: 150px; margin: 65px 120px; } #tabtextie{ margin: 0 185px; padding: 5px; height: 20px; width: 150px; } #tab{ position: fixed; width: 185px; height: 400px; color: #ccc; background-color: #242424; left: 0; margin: 0 auto; margin-top: -200px; top: 50%; padding-left: 20px; border-radius: 0 0 25px 0; z-index: 2; } #tab:hover{ left: 200px; }
#tab{ transition: .5s linear; -webkit-transition: .5s linear; -o-transition: .5s linear; -moz-transition: .5s linear; } #tab:hover{ transition: .5s linear; -webkit-transition: .5s linear; -o-transition: .5s linear; -moz-transition: .5s linear; }
<section id="tab"> <!--[if gt IE 8]><!--><div id="tabtext">Login/Register</div><!--<![endif]--> <!--[if lt IE 8]><div id="tabtextie">Login/Register</div><![endif]--> <h3>Login</h3> <form action="default.php" method="post"> <label for="Lname">Your Username:</label> <input type="text" id="Lname"><br> <label for="Lpass">Your Password:</label> <input type="password" id="Lpass"><br><br> <input type="submit" value="Submit"> </form> <br> <h3>Register</h3> <form action="default.php" method="post"> <label for="Rname">Your Username:</label> <input type="text" id="Rname"><br> <label for="Rpass">Your Password:</label> <input type="password" id="Rpass"><br> <label for="Rpass2">Password again:</label> <input type="password" id="Rpass2"><br><br> <input type="submit" value="Submit"> </form> </br></br></br></br></br></br></br></br></section>
-o-transform: translate(0px);
#tab:hover{ transition: .5s linear; -webkit-transition: .5s linear; -o-transition: .5s linear; -moz-transition: .5s linear; -o-transform: translate(0px); }
var
This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)