Home/ Questions/Q 940105
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-15T21:54:02+00:00

Can anyone see why this isnt working? For this example the box should turn

  • 0

Can anyone see why this isnt working? For this example the box should turn white when hovered over.

<style type="text/css" media="screen">
    .center {
        margin: 0 auto;
    }
    .box {
        width: 250px; 
        height: 250px; 
        display: block;
        background: #000; 
        border: 1px solid white; 
        float: left
    }
    .inner {
        width: 175px; 
        height: 175px; 
        display: block; 
        margin-top: 15%; 
        margin-left: 15%; 
        background: #fff;
        position: relative
    }
    .boxLink {
        position: absolute; 
        left: 0; 
        right: 0; 
        margin-left: auto; 
        width: 100%; 
        text-align: center; 
        line-height: 175px; 
        font-size: 30px
    }  
    a:link.boxLink {
        color:#000; 
        background: yellow
    }
    a:visited.boxLink {
        color:#000; 
        background: yellow
    }
    a:hover.boxlink {
        color:#fff; 
        background: white
    }
    a:active.boxLink {
        color:#000; 
        background: green
    }
</style>
</head>
<body>
    <div id="container">
        <div class="box">
            <div class="inner">
                <a class="boxLink" href="#">about</a>
            </div>
        </div>
    </div>
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    You need to put the class name before :hover:

    a.boxLink:link{color:#000; background: yellow}
a.boxLink:visited{color:#000; background: yellow}
a.boxLink:hover {color:#fff; background: white}
a.boxLink:active {color:#000; background: green}

    While my suggestion is good practice, you actually made a spelling error on that hover line: 

     a.boxlink:hover {color:#fff; background: white}

    CSS is case-sensitive, you need to make that l uppercase.

    • 0