css - 子div不会覆盖CSS中的父div

Question

目前，我页面的内容标题如下所示:

但我希望内容看起来像这样:

这是涉及该页面部分的 HTML:

<div class="header">My Tools<a href="#possess" class="anchor_link">View Tools you Possess</a></div>

还有我所涉及类的 CSS:

#content .header{
    font-size:180%;
    width:1000px;
    border-bottom:1px solid #000000;
}

#content .header .anchor_link{
    font-size:100%;
    text-align:right;
    text-decoration:none;
    color:#0059FF;
}

你能解释一下我在这里做错了什么，这样我就能得到想要的外观吗？

编辑:此外，为什么 anchor 中的文本不会变为 100% 而不是 180%

供将来引用:我解决了字体大小的问题，因为 100% 是引用父 div，所以为了使这个文本更小，我将 anchor 的字体大小更改为 60%

Answer 1

改变

#content .header .anchor_link{
    text-align:right;
}

到

#content .header .anchor_link{
    float:right;
}

Fiddle here.