Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 7 of 7
  1. #1
    New Coder
    Join Date
    Feb 2005
    Posts
    41
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Problem Styling a button

    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.



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

    Thansk in advance.

  • #2
    Senior Coder effpeetee's Avatar
    Join Date
    Feb 2007
    Location
    Clapham Junction - London SW
    Posts
    4,885
    Thanks
    228
    Thanked 204 Times in 203 Posts
    We need to see all your code please.

    Frank
    * Sources (updated: 21.11.2012.
    Using Windows 8 Professional. 64bit with HP Photosmart 5510 printer Very useful site here.

  • #3
    Senior Coder jcdevelopment's Avatar
    Join Date
    Oct 2007
    Location
    Cowboy Nation
    Posts
    2,179
    Thanks
    174
    Thanked 257 Times in 257 Posts
    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.

  • #4
    New Coder
    Join Date
    Feb 2005
    Posts
    41
    Thanks
    0
    Thanked 0 Times in 0 Posts
    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;
    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%}

  • #5
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,801
    Thanks
    160
    Thanked 2,216 Times in 2,203 Posts
    Blog Entries
    1
    tempest4000, please read this sticky thread, Please format code in your posts using the [code][/code] tag!, on how to post your code here. You may edit your post.
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • #6
    New Coder
    Join Date
    Feb 2005
    Posts
    41
    Thanks
    0
    Thanked 0 Times in 0 Posts
    ok, and again......

    HTML PAGE
    Code:
    <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

    Code:
    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%}

  • #7
    Senior Coder effpeetee's Avatar
    Join Date
    Feb 2007
    Location
    Clapham Junction - London SW
    Posts
    4,885
    Thanks
    228
    Thanked 204 Times in 203 Posts
    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
    * Sources (updated: 21.11.2012.
    Using Windows 8 Professional. 64bit with HP Photosmart 5510 printer Very useful site here.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •