Jump to content

Restyling a Login


Recommended Posts

I'm trying to make my login look like this:post-97155-0-02235600-1341932588_thumb.png I began with trying to make the borders how I want, but I've run into a roadblock. I can get the existing borders to go away, but once I do that I can't add in a bottom border. I've tried looking for a tutorial, but none of them are really helping. Can someone point me in the right direction? I'm not necessarily asking for code to make it work; if it's easier to just direct me to a website that would be fine. Thanks,Rebecca Here is my code:

<div id="login"><form method=post action="http://host.onlineprintsolutions.com/gandyprinters/login.asp"><input onfocus="if(this.value == 'Username'){this.value = '';}" type="text" onblur="if(this.value == ''){this.value='Username';}" id="name" value="Username" /><input onfocus="if(this.value == 'Password'){this.value = '';this.type='password';this.value=''}" type="text" onblur="if(this.value == ''){this.type='text';this.value='Password';}" id="name" value="Password" /><input class="clsSubmit" type=submit value="Go" id=submit1 name=submit1 onClick="if ((user.value=='') && (password.value=='')){alert('Please enter your user name & password');return false}"></form></div>

Here is my css:

#login input {border:0;}

Link to comment
Share on other sites

What was the code you tried to add the bottom border? I would do something like this:

#login input {  border: none; /* remove all borders */  border-bottom: 1px solid gray; /* add whatever style you want for the bottom border */}

Edited by ShadowMage
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Create New...