解决div的高度定义在IE6中不生效的问题

现象
近日在做一个页面时又遇到一个关于IE6的问题，页面的需求是要做一个空的div，div中不需要放任何文字，只需要放一个底色就可以了，纯粹只是为了界面的美观。但是在实际做的过程中却发现，这个空div在IE8和firefox环境下，是显示正常的，但是就只是在IE6（万恶的IE6）的环境下，其显示的高度总是大于我所定义的高度。

解决方案
一番调试之后，突然之间想起，以前好象在某篇文章中看到过有这时情况的介绍，马上去google一番，果然有解决方案，只需要在代码中加入font-size: 0;的定义就可以了。虽然以前看到过有这方面的介绍，但是没有记下来，时间一长就几乎忘记了。现在遇到，差一点就解决不了问题，所以这次特意记下来，以便加强记忆。下面列出关键的代码，以便于查看。

.news-container
{
  background-color: #dddddd;
  height: 5px;
  font-size: 0;
  width: 202px;
}

.news-container-div
{
  background-color: #c3c3c3;
  height: 5px;
  font-size: 0;
  width: 202px;
}

<div class="news-title">新闻列表</div>
<div class="news-container"></div>
<div class="news-container-div"></div>
<div style="border: 1px solid #dddddd; width: 200px; height: 50px;">
</div>