0

我创建了一个从起始高度过渡到更大高度的 div，显示了一个列表。它在 web-kit 浏览器中看起来不错，但在 Firefox 中，div 似乎很短，切断了列表的底部。

我尝试设置 div 高度，em希望 div 然后将高度与列表中使用的字体大小相匹配。仍然发生同样的事情。

有任何想法吗？

CSS：

#nav{
        padding:0;
        position:fixed;
        top:27px;
        left:27px;
        font-family:arial;
        font-size:10px;
        background-color:#ccc;
        width:11.3em;
        height:5.5em;
        overflow:hidden;
        transition: height .5s;
        -webkit-transition: height .5s; /* Safari */
    }
    #nav:hover{
        height:22em;
    }
    #nav a.bg:hover{
       background-color: #ccc;
    }
    #nav a{
       text-decoration:none;
       color:#000;   
    }
    #nav a:hover{
       background-color:#6a6a6a;

    }

HTML：

<div id="top">
    <div id="nav">
        <!--logo_image-->

            <a class="bg" href="#"><img src="b&w_logo.jpeg" height="56" width="110" /></a>

        <!---->

            <div style="height:1em;"></div>
            <div style="font-size:1.1em;"><b>Artists</b></div>
            <div style="height:1em;"></div>
            <div><a href="#">Ahnnu</a></div>
            <div><a href="#">Gem Vision</a></div>
            <div><a href="#">Dope Body</a></div>
            <div><a href="#">Co La</a></div>
            <div><a href="#">Teenage Souls</a></div>
            <div><a href="#">Kid Krusher</a></div>
            <div><a href="#">Lil Jabba</a></div>
            <div><a href="#">Cex</a></div>
            <div><a href="#">Teeth Mountain</a></div>
            <div><a href="#">Jimmy joe Roche</a></div>

    </div>

</div>
4

1 回答 1

0

我认为你有 2 个选项：一个称为 CSS 重置 - http://html5reset.org/

第二个称为标准化。它不是重置所有样式，而是针对需要更改的样式，以便以更小的文件大小在浏览器中为您提供理智、一致的结果。http://necolas.github.com/normalize.css/

于 2013-04-26T22:27:30.873 回答