0

大家好,我的 div 区域高度在以下浏览器中显示不同:Firefox 和 Internet Explorer。在 Chrome 和 Safari 中,我的 div 区域看起来不错,您能帮帮我吗?

这是我的 div 区域

.openmeclis 
{
    position:relative; 
    margin-left:4px;
    background:#66B3E3; 
    width:90px; 
    height:370px; 
    display:inline-block;
    overflow:hidden;    
}

这是一个大写我的意思这是来自 Firefox

在此处输入图像描述

这是来自 Chrome

在此处输入图像描述

<div id="subMenu">
    <div class="openbaskan" style="float:left">
        <a href="/Home/Baskan/45">Başkandan</a> <br />
        <a href="/Home/Baskan/46">&#214;zge&#231;mişi</a> <br />
        <a href="/Home/Baskan/47">Haberler</a> <br />
        <a href="/Home/Baskan/58">Videolar</a> <br />
        <a href="/Home/Baskan_foto">Fotoğraf Galerisi</a>
    </div>

    <div class="openmeclis" style="float:left">
    <a href="/Home/Sehir_Rehberi/93">Meclis &#220;yeleri</a> <br />
    <a href="/Home/Sehir_Rehberi/99">Meclis G&#252;ndemi</a> <br />
    <a href="/Home/Sehir_Rehberi/100">Meclis Kararları</a> <br />
    </div> 
</div>

CSS:

#subMenu
{        
    width:964px;
    margin-left:auto;
    margin-right:auto;
    display:none;
    font-size:14px;
    font-style:normal;
    height:336px;  
    font-family: 'Museo300Regular';         
}
4

2 回答 2

0

检查这个编辑过的答案

编辑演示

Note the edited CSS below:

.openmeclis 
{
    position:relative; 
    margin-left:4px;
    background:#66B3E3;
    width:90px; 
    height:370px; 
    overflow:hidden;
    float: left;
    list-style: none;
}

#subMenu {
    width:964px;
    margin-left:auto;
    margin-right:auto;
    font-size:14px;
    font-style:normal;
    height:336px;
}

HTML:
----------
<div id="subMenu">
    <div class="openmeclis">
        <ul>
            <li><a href="/Home/Baskan/45">Başkandan</a></li>
            <li><a href="/Home/Baskan/45">&#214;zge&#231;mişi</a></li>
            <li><a href="/Home/Baskan/45">Haberler</a></li>
            <li><a href="/Home/Baskan/45">Videolar</a></li>
            <li><a href="/Home/Baskan/45">Fotoğraf Galerisi</a></li>
        </ul>
    </div>

    <div class="openmeclis">
        <ul>
            <li><a href="/Home/Sehir_Rehberi/93">Meclis &#220;yeleri</a></li>
            <li><a href="/Home/Sehir_Rehberi/99">Meclis G&#252;ndemi</a></li>
            <li><a href="/Home/Sehir_Rehberi/100">Gündemi</a></li>
            <li><a href="/Home/Baskan/45">Meclis Kararları</a></li>
        </ul>
    </div> 
</div>​

不要添加不必要<br/>的标签。取而代之的是,您可以使用这些<ul>方法。当你有 CSS 时,你不需要在你的 html 中添加样式标签。我不知道您在...中添加了什么#sub menu...我刚刚编辑了 HTML 和 CSSopenmeclis

于 2012-10-23T14:50:25.870 回答
0

只需在您的 CSS 中使用 line-height 即可。因为每个浏览器呈现不同的行高,这就是为什么你的 div 在不同的浏览器上显示问题的原因。这是您提出的相同问题的链接

FireFox 3 行高

跨浏览器的 CSS 行高问题

于 2012-10-23T14:55:54.913 回答