开发者

Links not taking to class

for some reason my links aren't conforming to my class. What's going on?

.greyBoxTxt {
    font-family:Verdana, Arial, Helvetica, san开发者_Go百科s-serif;
    font-size:11px;
    color:#7b7d7e;
}

a.greyBoxTxt {
    color:#0164a5;
    text-decoration:none;
}

<table width="100%" border="0" cellspacing="0" cellpadding="0">
    <tr>
        <td width="25%" valign="top" class="greyBoxTxt">
            <b>Business Banking</b><br />
            <a href="#">eBusiness Checking</a><br />
            <a href="#">Business Checking</a><br />
            <a href="#">Commercial Checking</a><br />
            <a href="#">Non-Profit Checking</a><br />
            <a href="#">Business Savings</a><br />
            <a href="#">More...
        </a></td>
        <td width="25%" valign="top">&nbsp;</td>            <td width="25%" valign="top">&nbsp;</td>
        <td width="25%" valign="top">&nbsp;</td>
    </tr>
</table>


I guess what you're trying to do is more this

.greyBoxTxt {
    font-family:Verdana, Arial, Helvetica, sans-serif;
    font-size:11px;
    color:#7b7d7e;
}

.greyBoxTxt a {
    color:#0164a5;
    text-decoration:none;
}

<table width="100%" border="0" cellspacing="0" cellpadding="0">
    <tr>
        <td width="25%" valign="top" class="greyBoxTxt">
            <b>Business Banking</b><br />
            <a href="#">eBusiness Checking</a><br />
            <a href="#">Business Checking</a><br />
            <a href="#">Commercial Checking</a><br />
            <a href="#">Non-Profit Checking</a><br />
            <a href="#">Business Savings</a><br />
            <a href="#">More...
        </a></td>
        <td width="25%" valign="top">&nbsp;</td>            <td width="25%" valign="top">&nbsp;</td>
        <td width="25%" valign="top">&nbsp;</td>
    </tr>
</table>

The selector a.greyBoxTxt would select something like this, Commercial Checking


Your selectors are wrong: a.greyBoxTxt targets anchor elements with the classname greyBoxTxt. Something like thie:

<a class="greyBoxTxt" href="#">Lorem</a>

What you want is an anchor element which is a descendant of an element with classname greyBoxTxt:

.greyBoxTxt a {
    /* ... */
}

Note that in this new selector, the space between the .greyBoxTxt and the a is actually the descendant combinator.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜