help with controlling links within a div

Question

Ok here is my problem, I've got a div with a hover effect on it, it changes colors when the mouse is over the div, in turn the text inverts colors so that it remains readable. Now my problem is that the links themselves don't follow the color schemes and attacking the links on their own outside the div won't work until the mouse hovers directly over the link itself. Can anyone point me in the right direction.

The HTML

<div id="gs_home_blackbar">
<div id="ic_box_1"><span style="LINE-HEIGHT: 24px; FONT-SIZE: 20px"><strong>An Emerging Leader </strong></span><br />
This is where text goes</div>

<div id="ic_box_2"><br /> This is where text goes</div>
</div>

<div id="ic_box_3" class="a"><br /><br /><a href="#">This is where my link goes</a></div>
</div>

and here is the CSS that controls this section

#ic_box_3 {
    color:#fff;
    position:absolute;
    background:#000;
    margin:-130px 0px 0 860px;
    padding:27px 10px 10px 10px;
    text-align:left;
    width:230px;
    height:93px;
    font-family:Arial, Helvetica, sans-serif;
    font-size:13px;
    color:#fff;
    border-left:dotted 1px #fff;
    }
    #ic_box_3:hover {
    position:absolute;
    background:#fff;
    margin:-130px 0px 0 860px;
    padding:27px 10px 10px 10px;
    text-align:left;
    width:230px;
    height:93px;
    font-family:Arial, Helvetica, sans-serif;
    font-size:13px;
    color:#000;
    border-left:dotted 1px #000;
    }

Answer 1

Use a selector like this:

#ic_box_3:hover a {
  /* settings for anchors inside a hovered div */
}

Then if you need the situation where both are hovered, use this one:

#ic_box_3:hover a:hover {
  /* etc */
}

Answer 2

It seems like you are trying to make a link look like a button with a hover over effect. You don't have put it in a div and style the div. You can just style the anchor tag itself. Basically apply all those styles that you gave to the div to the anchor itself and tweak as needed.