Question

我对所有这些CSS业务都很陌生，所以如果我错过了一些明显的东西，请原谅我。我使用960.gz网格系统在www.locodingo.com上创建网站

我有一个问题是在我的菜单下面显示位于我网站Chrome右侧的浅灰色框（我的CSS代码中的adBox），但它在Firefox和Internet Explorer中加载得很好。我已经搞砸了几乎所有变量，但却无法让它显示出来。请帮忙！

* {
    font-family:Arial, Verdana, sans-serif;
    color:black;
}

#header {
    background-color:#d3d3d3;
    height:90px;
    border-radius:10px;
    position:absolute;
}

#header #logo {
    height:80px;
    padding:5px;

}

#nav li {
    color:#F58535;
    background-color:white;
    float:right;
    position:relative;
    top:-99px;
    right:0px;
    text-align:left;
    display:inline;
    padding:7px;
    font-weight:bold;
    margin-right:15px;
    border-radius:5px;
}

#nav2 li {
    color:#6ABD50;
    background-color:white;
    position:relative;
    display:inline-block;
    float:right;
    top:32px;
    padding:7px;
    font-weight:bold;
    margin-right:15px;
    border-radius:5px;
    right:10px;
}

#nav li:hover {
    background-color:#F58535;
    color:white;
}

#nav2 li:hover {
    background-color:#6ABD50;
    color:white;
}

#adsBox {
    height:250px;
    background-color:#F2F3F3;
    margin-top: 50px;
    clear:right;
    border-radius:10px;
    display:inline-block;
}

#adsBox p {
    margin:5px;
    text-align:justify;
}

#footer {
    position:relative;
    background-color:black;
    color:#F58535;
    font-weight:bold;
    font-family:sans-serif;
    font-size:12px;
    text-align:center;
    height:20px;
    clear:both;
}

bodyText{
    right:122px;
    position:relative;
    float:left;
    color:red;
    display:block;
}

Answer 1

    <div class="container_12 clearfix">
        <div id="header" class="grid_12">
            <img id="logo" src="images/logo.png"/>
            <div id="nav">
                <ul>
                    <li>Contact Us</li>
                    <li>Message Board</li>
                    <li>Opinion</li>
                    <li>Articles</li>
                </ul>
            </div>
        </div>
    </div>
    <div id="nav2">
        <ul>
            <span><li>Cosplay</li></span>
            <span><li>Tattoos</li></span>
            <span><li>Music/Art</li></span>
            <span><li>Recipes</li></span>
        </ul>
    </div>   
    <div class="container_12 clearfix">
       <div id="bodyText" class="grid_8"><p>Just safdsfdadfafdfdome random stuff here.ust safdsfdadfafdfdome random stufust safdsfdadfafdfdome random stufust safdsfdadfafdfdome random stufust safdsfdadfafdfdome random stufust safdsfdadfafdfdome random stufust safdsfdadfafdfdome random stuf adggdadgsagddgsdsgagsd</p></div>

        <div id="adsBox" class="grid_4"><p>Test text here est text hereTest text here est text hereTest text here est text hereTest text here est text hereTest text here est text hereTest text here est text hereTest text here est text hereTest text here est text here</p>
        </div>

    </div>

Answer 2

您是否在Chrome中使用了AdBlockPlus或任何类型的广告拦截器扩展程序？如果是这样，它可能会根据其ID隐藏该块。

Answer 3

杰克能够为我解答我的问题。确实是AdBlockPlus阻止了div容器，因为它被称为＆＃34; adsBox＆＃34;并包含“＆＃34; ads＆＃34;”这个词。我觉得很愚蠢 - 我猜这只是我在旅途中要了解的那些愚蠢的小事之一。

因此，为了将来参考 - 请不要在任何容器上注明＆＃34;广告＆＃34;在里面。

感谢大家帮助我。你们每个人都拥有我能够使用的有价值的信息。

CSS元素不会出现在Chrome中，但会出现在Firefox上

3 个答案: