css - div width auto!important在ie6/ie7中似乎不起作用

HTML

<div class="grid_11 omega" id="homeGalleryFichaGold">
        <div class="contSlideGalleryUp" style="display: none;">
                                    <a href="javascript:;" onclick="$('#panelGallery').slideToggle(); $('.contSlideGalleryUp').hide(); $('.contSlideGalleryDown').slideToggle('slow');" id="openGallery" class="openGallery" title="">HOTEL GALLERY</a>
        </div>
        <div style="display: block;" class="contSlideGalleryDown">
                                    <a href="javascript:;" onclick="$('#panelGallery').slideToggle(); $('.contSlideGalleryUp').slideToggle('slow'); $('.contSlideGalleryDown').hide();" id="closeGallery" class="closeGallery" title="">HOTEL GALLERY</a>
                                </div>
                                <div style="display: block;" id="panelGallery">
                                    <ul>
                                        <li class="selected"><a class="photos" href="#" title=""><span>PHOTOS</span></a></li>
                                        <li><a class="videos" href="#" title=""><span>VIDEOS</span></a></li>
                                        <li><a class="suites" href="#" title=""><span>SUITES 3D</span></a></li>
                                        <li><a class="location" href="#" title=""><span>LOCATION</span></a></li>
                                        <li><a class="publication" href="#" title=""><span>PUBLICATION</span></a></li>
                                        <li><a class="tour" href="#" title=""><span>INTERACTIVE TOUR</span></a></li>
                                        <li><a class="panorama" href="#" title=""><span>PANORAMA</span></a></li>
                                        <li><a class="googlearth" href="#" title=""><span>GOOGLE EARTH</span></a></li>
                                    </ul>
          </div>
    </div>

基本上我无法在IE6 / 7中使#panelGallery具有“自动”宽度（在所有其他功能上都可以正常工作）

的CSS

    #panelGallery {
        background-color: #333;
        color: #FFFFFF;
        float: right;
        font-size: 11px;
        font-weight: bold;
        height: 65px;
        line-height: 65px;
        opacity: 0.9;
        /*width: 640px;*/
        position:absolute;
        bottom: 0px;
        right:0px;
    }
    .contSlideGalleryDown {
    position:absolute;
    bottom: 65px;
    right:0;
}

我为ie6 / 7添加了这个hack

#panelGallery {
    *width: auto !important;
}

但仍使用所有宽度

最佳答案

IE似乎使用Quirks模式，因为我确定IE6 / IE7支持width:auto。您可以在下面插入书签以检测渲染模式。

javascript:alert(document.compatMode)

CSS1Compat表示标准模式和BackCompat怪癖模式。

如果显示BackCompat，则表示IE在<!DOCTYPE>之前看到了内容。 IE 6和7如果在DOCTYPE，BOM标记或HTML注释计数之前几乎看不到任何内容，则使用Quirks模式。

已经存在一些问题，因此我将链接到它：Why is the site running in IE quirks mode?

顺便说一句，http://validator.nu/可以通过使用注释或BOM标记来检测站点是否将触发IE中的Quirks模式。

同样，某些DOCTYPE可以触发Quirks Mode，即使之前没有任何内容可以触发Quirks Mode。 http://hsivonen.iki.fi/doctype/包含这些特殊DOCTYPE的列表。

关于css - div width auto!important在ie6/ie7中似乎不起作用，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/7415197/