1

我是 CSS 新手,确实需要一些帮助来解决我刚刚完成的这个网站的问题。除了 IE7(IE8 或 IE9 必须在兼容性视图中查看)外,在 FF、safari、chrome 中一切看起来都很好(opera 看起来不错)。

当我在 IE 浏览器中查看时,上边距完全丢失,这使得它不对齐。我曾尝试从不同的站点搜索一些解决方案,但没有运气...

我知道旧的 IE 也遇到了 PNG 文件的问题,这就是问题之一(当 PNG 文件用于掩盖图像的某些部分时)——它不会显示出来。

这些图像在 IE7 上搞砸了。我无法显示任何屏幕截图,因为我的 IE8 在 CV 模式下似乎工作正常 :(

很抱歉下面的一长串代码,但我不知道它的哪一部分出错了。现场网站位于 www.heightprotectionsolutions.com.sg(在这里可能更容易查看)。任何帮助是极大的赞赏!

<body>  
<div id="container"> 

    <!-- BEGIN OF HEADER -->
    <div id="header-container">
        <div id="header-box">

            <!-- begin of logo -->
            <div id="logo">
                <a href="#"><img src="images/logo_home.png" alt="main-logo" /></a>
            </div>
            <!-- end of logo -->

            <div id="righttop-header">
                <div id="top-information">
                    <p>For additonal information call : +65 9793 2263 | fax : +65 6748 2123</p>
                </div>

                <!-- begin of mainmenu -->
                <div id="mainmenu">
                    <ul id="menu">
                        <li><a href="index.html">home</a></li>
                        <li><a href="about.html">about</a></li>
                        <li><a href="services.html">services</a></li>
                        <li><a href="#">products</a>
                            <ul> 
                                <li><a href="GFP.html">GFP</a></li>
                                <li><a href="innotech.html">Innotech</a></li>
                            </ul>
                        </li>
                        <li class="current"><a href="partners.html">partners</a></li>
                        <li><a href="contact.html">contact</a></li>
                    </ul>                
              </div>
                <!-- end of mainmenu -->                    
            </div>

        </div>            
    </div>
    <!-- BEGIN OF HEADER -->

    <!-- BEGIN OF SLIDESHOW -->
    <div id="slideshow-container">
        <div id="slide-top"></div>            
        <ul id="slider">
            <!-- begin of slide 1 -->
            <li>
            <div class="slide-content-wrapper">                             
                <div class="slide-content">                        
                    <div class="slide-text">
                        <h1>Uncompromised Safety.</h1>
                        <p>The Trusted Safety Lifeline</p>
                        <a class="button small yellow" href="contact.html"><span>get a quote &nbsp;&raquo;</span></a>
                    </div>                                    
                </div>
                <div class="slide-dot"></div>
            </div>
            <img src="images/slideshow/slide1.jpg" alt="" />
            </li>
            <!-- end of slide 1 -->

这是CSS代码。不确定我是否必须为 IE7 设置固定边距才能正常显示,就像其他浏览器一样?

#container{ 
margin:0px 0px 0px 0px; 
}
#header-container{
width:100%;
}
#header-box{
width:1090px;
margin:0px auto;
#header-box{
margin:50px auto 0px auto;
}   
}
#slideshow-container{
width:1090px;   
margin:30px auto 48px auto;
}
#headerimage-container{
width:1090px;   
margin:48px auto 0px auto;
}
#slide-top, #headerimage-top{
width:1090px;
height:99px;
background-image:url(../images/bg-top-slide2.png);
background-repeat:no-repeat;
position:absolute;
z-index:100;
float:left;
4

0 回答 0