www.webdeveloper.com
Results 1 to 3 of 3

Thread: CSS Buttons

  1. #1
    Join Date
    May 2008
    Posts
    3

    CSS Buttons

    Hi,

    Can someone help me, i want to arrange the button in horizontal position, but it's going in vertical position. Can someone check and fix this for me.

    HTML CODING
    <tr>
    <td colspan="2" < class="button"><a href="http://scigate.com.sg">Click this button</a></td>


    </tr>

    CSS CODING

    <style type="text/css">
    .button {
    display:block;
    width:100px;
    height:20px;
    text-indent:-9999px;
    }
    .button a {
    display:block;
    width:100%;
    height:100%;
    background:transparent url(templates/scigate/images/home-button.png) no-repeat top left;
    outline:none;
    }
    .button a:hover {
    background-position:0 -20px;
    }
    </style>

    Thanks
    Satia

  2. #2
    Join Date
    Mar 2012
    Posts
    1,639
    Quote Originally Posted by satia View Post

    Can someone help me, i want to arrange the button in horizontal position, but it's going in vertical position. Can someone check and fix this for me.

    HTML CODING
    <tr>
    <td colspan="2" < class="button"><a href="http://scigate.com.sg">Click this button</a></td>
    </tr>
    1. There is a spurious "<" before"class=". If you validated the code you would have found that.

    2. You should not use tables for markup.

    3. There is only one button in the example, and it is in a table row of its own. How could it possibly be "in horizontal position"? Or vertical? Horizontal with respect to what?

    Then there is the CSS:

    4. I do not recognise the syntax:

    .button a {

    Should that be:

    a.button {

    5. Similarly, I suspect:

    .button a:hover {

    Should be:

    a.button:hover {

    The latter syntax works for me! Also, these errors may be incidental to the issue you have raised, but if you had validated the HTML and the CSS before submitting your question you would have found them.
    Last edited by jedaisoul; 03-26-2012 at 08:54 AM.

  3. #3
    Join Date
    Mar 2012
    Posts
    1,639
    Please ignore my comments above about the CSS code. The syntax is valid.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles