html - How to keep my objects from moving on when resizing window? -
i working in css , html... looks fine when rezise window, textboxes , button move out of position. want stay in place when window resized.. help.. tried using wrapper suggested in other places i've looked think im either doing wrong or doesnt work.
here site can better grip on im talking about... http://www.difgropliego.comze.com/diflogin.html
<html> <head> <style> #wrapper { width: 800px; margin:0 auto; } body { background-color:black; background-image:url(diflogin.png); background-repeat:no-repeat; background-position:center top; margin:0 10% 0 10%; padding:0 0 0 0; border:0 0 0 0; } #user { position:absolute; left: 306px; top: 455px; } #contra { position: absolute; left: 904px; top: 455px; } #web-buttons-idgi5a2 { position: absolute; left: 1023px; top: 601px; } #web-buttons-idgi5a2 { display:block; } #web-buttons-idgi5a2 a:hover { background-position:left bottom; } #web-buttons-idgi5a2a { display:none } </style> </head> <body> <div id="wrapper"> <label for="user"></label> <input type="text" name="user" id="user" /> <label for="contra"></label> <input type="text" name="contra" id="contra" /> <table id="web-buttons-idgi5a2" width=0 cellpadding=0 cellspacing=0 border=0> <tr> <td style="padding-right:0px" title ="ingresar"> <a href="#" title="ingresar" style="background-image:url(buttoning.png);width:160px;height:61px;display:block;"><br/></a> </td> </tr> </table> </div> </body> </html>
for inputs if want them stay displayed in screen try use percentage below :
#user{ position:absolute; left: 10%; top: 20%; }
Comments
Post a Comment