...

View Full Version : Problem Styling a button



tempest4000
05-21-2008, 04:56 PM
I have the following to style a button but for some reason I have a solid black line on the bottom together with a white dashed line when it should be white and dashed. Anyone know how to get rid of it? Im not sure if its a shadow or something.

http://www.itfx-dev.co.uk/gmd_pennine/images/button.png

input.login_submit {
border: none;
border-bottom: 1px dashed #FFF;
background-color: transparent;
font-size:90%;
color:#fff;
cursor:pointer;
margin:0;
padding:0;
}

Thansk in advance.

effpeetee
05-21-2008, 05:04 PM
We need to see all your code please.

Frank

jcdevelopment
05-21-2008, 05:16 PM
There may be an existing problem somewhere else in the code. So we need a link or the CSS posted, it will be easier on us.

tempest4000
05-21-2008, 05:21 PM
below is allthe code relating to the login page where the problem is. Many thanks for your help

HTML PAGE
<div class="login">
<p style="margin-bottom:10px">login / register</p>
<p>username<br>
<input type="text" class="login"></p>
<p>password<br>
<input type="text" class="login"></p>
<p align="right"><input type="submit" value="submit" class="login_submit"></p>
<p><a href="" class="login">forgotten your password?</a></p>
<p><a href="" class="login">not registered? register here.</a></p>
</div>

CSS

div.login {
padding: 10px;
background-color: #1F7774;
width: 121px;
}

input.login {
width: 115px;
height: 10px;
font-size: 85%;
}

.login p {margin:0 0 5px 0}

input.login_submit {
border: none;
border-bottom: 1px dotted #FFF;
background-color: transparent;
font-size:90%;
color:#fff;
cursor:pointer;
margin:0;
padding:0;
}

a.login:link {color: #fff; text-decoration:none;background-color:transparent;font-size:90%}
a.login:visited {color: #fff; text-decoration:none;background-color:transparent;font-size:90%}
a.login:hover {color: #fff; text-decoration:underline;background-color:transparent;font-size:90%}
a.login:active {color: #fff; text-decoration:none;background-color:transparent;font-size:90%}

abduraooft
05-21-2008, 05:24 PM
tempest4000, please read this sticky thread, http://www.codingforums.com/showthread.php?t=82672, on how to post your code here. You may edit your post.

tempest4000
05-21-2008, 05:37 PM
ok, and again......

HTML PAGE

<div class="login">
<p style="margin-bottom:10px">login / register</p>
<p>username<br>
<input type="text" class="login"></p>
<p>password<br>
<input type="text" class="login"></p>
<p align="right"><input type="submit" value="submit" class="login_submit"></p>
<p><a href="" class="login">forgotten your password?</a></p>
<p><a href="" class="login">not registered? register here.</a></p>
</div>
CSS


div.login {
padding: 10px;
background-color: #1F7774;
width: 121px;
}

input.login {
width: 115px;
height: 10px;
font-size: 85&#37;;
}

.login p {margin:0 0 5px 0}

input.login_submit {
border: none;
border-bottom: 1px dotted #FFF;
background-color: transparent;
font-size:90%;
color:#fff;
cursorointer;
margin:0;
padding:0;
}

a.login:link {color: #fff; text-decoration:none;background-color:transparent;font-size:90%}
a.login:visited {color: #fff; text-decoration:none;background-color:transparent;font-size:90%}
a.login:hover {color: #fff; text-decoration:underline;background-color:transparent;font-size:90%}
a.login:active {color: #fff; text-decoration:none;background-color:transparent;font-size:90%}

effpeetee
05-21-2008, 10:02 PM
That is not the complete code. The html is minimal and no Doctype.
We can't guess what you have, can we.
At least I can't.

Frank



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum