-4

我正在尝试使我的网站跨浏览器和分辨率兼容，但由于某种原因，当调整窗口大小时，我的网站右侧出现奇怪的空白？如果它在我的原生 1600x900 res 中全屏就好了，我已经设置min-width: 100%了横幅、导航选项卡和顶部的蓝条等元素。

在此处输入图像描述

CSS：

body { background-color:#F5F5F5; font-family:Verdana, Geneva, sans-serif; font-size:14px; margin: 0px auto; border-top: 15px solid #003663; }
.header { padding:0px 10px 0px 10px; height:170px; margin:0 auto; width:1050px; margin-top:0px; }
.container { width: 1025px; margin: 0 auto; }

div.menubar { background: #ccc; width: 100%; min-width: 100%;}
div.banner-image { overflow: hidden; width: 100%; height: 100%; z-index: 1; }

图片横幅的 HTML：

    <div class="menubar">
        <div class="container">
            <ul id="topnav">
                    <?php
                    Template::Show('core_navigation.tpl');
                    ?>
            </ul>
        </div>
    </div>

            <div class="banner-image">
                <div class="slicebox-wrapper">
                    <ul id="sb-slider" class="sb-slider">
                        <li><img src="<?php echo SITE_URL?>/lib/skins/flyeuro/scripts/slicebox/img/ab1.jpg" alt="image1"/></li>
                        <li><img src="<?php echo SITE_URL?>/lib/skins/flyeuro/scripts/slicebox/img/ab2.jpg" alt="image2"/></li>
                    </ul>   
                </div>
            </div>
4

1 回答 1

2

如果 div 的背景没有固定的最小宽度，这是一个常见问题。百分比没有帮助。背景不会显示在滚动区域中。你需要给它min-width: ..px

使其最小宽度：1050px，因为您的标题使用 1050px。

于 2013-01-08T20:09:51.020 回答