Grow your CSS skills. Land your dream job.

onmouseout – how do I get it to go back to the default color

  • # August 7, 2008 at 5:39 pm

    Website: http://www.studentseatfree.com/search.php

    So I’m trying to have this entry have a rollover color but I can’t figure out how to get it to go back to the default color after you mouse out. It stays the color of the mouse rollover color. Suggestions?

    HTML:

    Code:
    < !DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">



    Sort by:



    Showing all coupons

    < 1 >
     All Listings

    Caliente Grille View map
      2 for $10 on Tuesdays

    Grand China Buffet View map
      10% Discount

    Little Tokyo View map
      10% Discount

    Spicy Pickle View map
      10% Discount




    CSS:

    Code:
    * { margin: 0; padding: 0; }

    body
    {
    font-family: Helvetica, Arial, Verdana, sans-serif;
    font-size:12px;
    }

    .everything
    {
    background:url(images/bg.jpg);
    background-position: center top;
    background-repeat:repeat-y;
    margin:0px auto;
    width:999px;
    display:block;
    }

    .searchbox
    {
    background:url(images/topgreen.jpg);
    background-repeat:no-repeat;
    height:30px;
    width:999px;
    }

    .searchformbox
    {
    margin-top:-27px;
    margin-left:30px;
    }

    .logobox
    {
    background:url(images/newlogo.jpg);
    width:175px;
    min-height:135px;
    height:135px;
    float:left;
    display:inline;
    margin-left:20px;
    margin-top:10px;
    }

    .adtopbox
    {
    background:url(images/adtopholder.jpg);
    width:730px;
    min-height:90px;
    height:90px;
    margin-left:200px;
    margin-top:20px;
    }

    .adbox
    {
    background:url(images/adboxholder.jpg);
    width:300px;
    min-height:250px;
    height:250px;
    float:right;
    margin-right:70px;
    margin-top:15px;
    }

    .skyscraper
    {
    background:url(images/skyscraperad.jpg);
    width:160px;
    min-height:600px;
    height:600px;
    float:right;
    margin-right:-223px;
    margin-top:294px;
    }

    .contentbox
    {
    width:560px;
    min-height:100px;
    padding: 5px;
    background-position: left top;
    margin-left:30px;
    }

    .description
    {font-size:16px;
    }

    .results
    {
    margin-left:30px;
    }

    .resultspadding
    {
    padding:5px;
    }

    .restname
    {
    font-family: Helvetica, Arial, Verdana, sans-serif;
    font-size:20px;
    font-weight:bold;
    }

    .floatleft {
    float: left;
    margin: 0px 10px 10px 0px;
    }

    .refine
    {
    background-color:#eeeeee;
    min-height:25px;
    width:890px;
    padding:5px;
    margin-left:30px;
    margin-top:40px;
    background-position: center top;

    }

    /*Footer*/

    #footer {
    padding:10px 0px 70px 10px;
    color:#0c0c0c;
    width:951px;
    background-color:#daf2c8;
    font-size:9px;
    text-align: left;
    line-height:12px;
    margin:35px auto 0px;
    }

    #footer img {
    float:left;
    margin-right:10px;
    }

    #footer span {
    display:block;
    float:left;
    width:300px;
    }

    #footer a {
    color:#9e8292;
    text-decoration:none;
    }

    img {border:none}

    div.clear { clear: both; }

    .boxlink
    {
    color:#000000;
    text-decoration:none;
    }

    # August 10, 2010 at 2:52 pm
    Code:
    .contentbox:hover { background-color:#fee393;}

    Put that in your css, get rid of the onmouseover and onmouseout events.

Viewing 2 posts - 1 through 2 (of 2 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".