this navbar fill of image and i'm confuse how can i style this and this my try and the code i used <div id="login"> <form action="#" method="get" class="login_blue"> <label>login:</label> <input value="" type="text" class="login_input" /> <input value="" type="password" class="login_password" /> <img src="images/locker.gif"/> <input value="" type="button" class="button_login"/> <a href=""><img src="images/register.gif" class="register"/></a> </form> <form action="#" method="get"> <label>SEARCH:</label> <input value="" type="text" /> <input value="" type="button" /> </form> </div><!--login--> #login{ background:url(images/login.gif) no-repeat scroll center; color:#FFFFFF; margin-top:2px; } .login_input{ background:url(images/login_textbar.gif) no-repeat scroll top; border:0 none} .login_password{ background:url(images/login_password.jpg) no-repeat scroll top; border:0 none} .button_login{ background:url(images/button_login.gif) no-repeat scroll center; border:0 none; width:56px; height:27px; cursor:pointer; } .register{ border:0 none} form{display:inline} Code (markup): Here's the link of the problem Any ideas plz Thx in advances
.login_input{ background:url(images/login_textbar.gif) no-repeat scroll top; border:0 none} .login_password{ background:url(images/login_password.jpg) no-repeat scroll top; border:0 none} .button_login{ background:url(images/button_login.gif) no-repeat scroll center; border:0 none; width:56px; Code (markup): What's this scroll business? Have a read of this page which is about background positioning and apply the values listed rather than scroll: http://www.w3schools.com/css/pr_background-position.asp
scroll is for background attachment not for background positioning. background positioning may keyword or % or px and scroll is the default setting in the browser and what i do is just declare it any ideas plz
I've just given you some ideas Don't use scroll there - read the W3C article on background positioning and use those values instead