我在 Internet Explorer 中随机切断背景 div 时遇到问题...
这是它的外观,取自 webkit/chromium 浏览器。
这是 Internet Explorer 认为它应该看起来的样子......
该网页可在http://beta.surrealholidays.com找到。任何有关如何解决此问题的反馈将不胜感激。
HTML 源代码:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<link href="/css/alt.css" rel="stylesheet" type="text/css">
<meta name="robots" content="all">
<meta name="author" content="surrealholidays.com">
<meta name="robots" content="index,follow">
<meta name="SKYPE_TOOLBAR" content ="SKYPE_TOOLBAR_PARSER_COMPATIBLE"/>
<link rel="shortcut icon" href="http://www.surrealholidays.com/images/logo.ico">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script type="text/javascript" src="/js/prototype.js"></script>
<script type="text/javascript" src="/js/scriptaculous.js?load=effects,builder"></script>
<script type="text/javascript" src="/js/lightbox.js"></script>
<script src="/js/flash.js" type="text/javascript"></script>
<link rel="stylesheet" href="/css/lightbox.css" type="text/css" media="screen" />
<title>Welcome to Surreal Holidays</title>
</head>
<body class="oneColFixCtr">
<div id="bannerph">
<div id="bannerint">
<div id="logoph" align="left">
<p><img src="/images/logos/newlogo.png" width="204" height="99" alt="Site Logo"></p>
</div>
<div id="callus" align="right">
<p><br>
Call Us:</p>
<h1>0845 003 5043</h1></div>
<p> </p>
</div>
</div>
<div id="page">
<div id="links">
<a href="/">Homepage</a> <a href="/destinations">Luxury Destinations</a> <a href="/tours">Private Tours</a> <a href="/terms/">Terms & Conditions</a> <a href="/enquire">Enquire</a> <a href="/news">News</a> <a href="/contact">Contact Us</a></div>
<div id="ct">
<div id="navig">
<div class="c2 c1" id="navi_direc">
<div align="left">Homepage ></div>
</div>
<div id="navi_newsl"> <a href="/newsletter/index.html">Subscribe</a> to our Latest Offers</div>
</div>
<div id="img">
<p><img src="/images/mainstory.jpg" width="995" height="400"> </p>
</div>
<div id="content">
<div id="hp_welcome">
<h2 align="left">Private Luxury Escorted Tours in Thailand </h2>
<p align="left"> </p>
<p align="left" class="c2"><strong>At Surreal Holidays, you can really feel the passion for Thailand. From the first moment you contact our experienced team, you will be amazed by the in-depth local knowledge and deep love of the country and its people that you encounter. Not surprising! Some of us were born and raised in Thailand before moving to the UK. You will find we have a unique ability to understand how travellers from the UK can experience the best Thailand has to offer. No ordinary travel company, Surreal Holidays can tailor a holiday especially for you. Along the way, your experience will be enhanced by our high levels of customer service and thoughtful personal touches.</strong></p>
<p class="c2"> </p>
<h2 align="left" class="c3"><strong>Bespoke Holidays to Thailand</strong></h2>
<p align="left" class="c2"></p>
<p align="left" class="c2"><strong>Our founder's inspiration: "..like you, when I travel, I use all my senses to enhance the experience. This often leads to a "surreal" feeling, as though the holiday is a dream like state where the strange and bizarre juxtaposition with the calm and beautiful. Nowhere epitomises this more than Thailand, my homeland. Whether you are looking for an inspirational island hopping itinerary or romantic wedding and honeymoon locations, soft adventure activities or cultural experiences, you need look no further. Thailand offers much more than just a place to relax on a beach. You can discover unique flora and fauna, stunning marine parks, and breathtaking scenery at every turn. Indeed, there really is something for everyone in our Amazing Thailand."... Runci Weeden</strong></p>
<p align="left" class="c2"> </p>
<h2 align="left" class="c3"><strong>Unique Holidays to Thailand</strong></h2>
<p align="left" class="c2"></p>
<p align="left" class="c2"><strong>To find out more information on our Escorted Tour Holidays, including Nature Tours, Cultural Tours or Adventure Tours to Thailand, call 0845 003 5043 and speak to our friendly team.</strong></p>
<p align="left" class="c2"> </p>
</div>
<div id="col2">
<div id="hp_ftcol2off">
<h3 align="center"><strong>Our Latest Offers</strong></h3>
<p align="center"> </p>
<p align="center">
<h3>Offers Coming Soon!</h3>
</p>
<p align="center"> </p>
<h3 align="center">Layana Resort and Spa<br>
From £89 pppn
</h3>
<p> </p>
</div>
<div id="hp_ftcol2foll">
<h3>Follow Us</h3>
<p align="center" class="c2"><a href="https://www.facebook.com/SurrealHolidays"><img src="/images/social_icons/facebook.png" alt="Find us on Facebook" width="64" height="64" border="0"></a><a href="https://twitter.com/#!/surrealholidays"><img src="/images/social_icons/twitter.png" alt="Follow us on Twitter" width="64" height="64" border="0"></a><a href="https://plus.google.com/u/0/115488031855843811543/posts"><img src="/images/social_icons/google.png" alt="Find us on Google Plus" width="64" height="64" border="0"></a><a href="http://www.youtube.com/surrealholidays"><img src="/images/social_icons/youtube.png" alt="Watch us on Youtube" width="64" height="64" border="0"></a><a href="http://vimeo.com/surrealholidays"><img src="/images/social_icons/vimeo.png" alt="Watch us on Vimeo" width="64" height="64" border="0"></a><br>
<br>
</p>
</div>
<div id="hp_ftcol2news">
<h3><strong>Latest News</strong></h3>
<h3>20 March 2012</h3>
<h3><u><strong>Welcome To Our New Website!</strong></u>
<br>
We have now launched our brand new website, for an improved compatability for Tablet Devices, as well as a much faster loading speed for a enhanced browsing experience. For more information about this update, <br>
<u>Click Here</u>.</h3>
<p> </p>
<p align="center" class="c2"><br>
<br>
</p>
</div>
</div>
</div>
</div>
<div id="footer">
<div id="f_tr">
<br>
Tel: 0845 003 5043 (Local Rates from a BT Landline) , 01628 685 550<br>
<strong>© Surreal Holidays Ltd. 2009-2012 All Rights Reserved.</strong><br>
<div id="f_php">
<div id="f_ph1"><img src="/images/logos/logo-amazing.png" width="145" height="45" alt="Thailand"></div>
<div id="f_ph2">
<p>Surreal Holidays is the Trading Name of Surreal Holidays Ltd. Company Number: 06690344<br>
<a href="/disclaimer">Disclaimer</a> | <a href="/privacypolicy">Privacy Policy</a> | <a href="/copyright">Copyright</a></p>
</div>
<div id="f_ph3">
<img src="/images/logos/logo-atol.png" width="45" height="45" alt="A"><img src="/images/logos/logo-atta.png" width="45" height="45" alt="** PLEASE DESCRIBE THIS IMAGE **"></div>
</div>
</div>
</div> <!-- Closing Tags For #Footer -->
</div>
</body>
</html>
这是样式表:
@charset "utf-8";
/* CSS Document */
a:link {
color: #fff;
text-decoration: none;
}
a:visited {
text-decoration: none;
color: #fff;
}
a:hover {
text-decoration: underline;
color: #fff;
}
a:active {
text-decoration: none;
color: #fff;
}
body {
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
margin: 0;
padding: 0;
text-align: center;
background: url(/images/background.jpg) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
#page {
width:995px;
margin: 0 auto;
padding: 0px;
}
#ct {
background-image:url(/images/bg.png);
overflow:visible;
}
#bannerph {
width: 100%;
background-image:url(/images/banner.png)
}
#bannerint {
width: 995px;
height: 140px;
padding: 10px;
margin: 0 auto;
}
#logoph {
width: 300px;
float: left;
padding: 10px;
}
#callus {
width: 500px;
float: right;
}
#links {
background-image: url(/images/logos/li.jpg);
background-repeat: repeat-x;
color: #fff;
vertical-align: middle;
padding: 10px;
margin-bottom: -2px;
}
#linkblock{
padding: 10px;
}
#navig {
height: 30px;
width: 995px;
padding: 10px;
}
#navi_direc{
float:left;
width: 500px;
font-size: 12px;
padding-left: 10px;
padding-right: 10px;
}
#navi_direc a {
color: #000
}
#navi_newsl{
float: right;
width: 449px;
font-size: 12px;
}
#content {
height: auto;
background-image: url(/images/mainbggrad.jpg)
font-size: 12px;
overflow:hidden;
}
#content h2 {
font-size: 18px;
color: #7d6543;
font-weight: bold;
line-height: 22px;
margin-top: 10px;
margin-right: 0px;
margin-bottom: 0px;
margin-left: 5px;
}
#content h3 {
font-size: 14px;
font-weight: normal;
color: #fff;
line-height: normal;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 5px;
margin-left: 0px;
}
#content h4 {
font-size: 13px;
font-weight: normal;
line-height: normal;
color: #8A5D3C;
margin-top: 5px;
margin-right: 0px;
margin-bottom: 5px;
margin-left: 0px;
}
#content h5 {
margin: 0px;
font-size: 12px;
font-weight: normal;
line-height: normal;
color: #8A5D3C;
padding-left: 10px;
padding-right: 10px;
}
#col2 {
line-height: normal;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 5px;
margin-left: 5px;
font-size: 12px;
color: #FFF;
}
#content p {
line-height: normal;
margin-top: 0px;
margin-right: 10px;
margin-bottom: 5px;
margin-left: 5px;
font-size: 12px;
color: #000;
}
#hp_welcome{
width: 550px;
float:left;
padding: 10 px;
color: #7d6543;
}
#hp_ftcol2off {
width:380px;
float:right;
margin: 10px 10px 0 10px;
background-image: url(/images/logos/news.jpg);
background-repeat: repeat-y;
border-radius: 10px;
}
#hp_ftcol2news {
width:380px;
float:right;
margin: 10px 10px 10px 10px;
background-image: url(/images/logos/news.jpg);
background-repeat: repeat-y;
border-radius: 10px;
color: #FFF;
}
#hp_ftcol2foll {
width:380px;
float:right;
margin: 10px 10px 10px 10px;
background-image: url(/images/logos/news.jpg);
background-repeat: repeat-y;
border-radius: 10px;
color: #FFF;
}
#hp_ftcol2off table tr td {
font-family: Trebuchet MS, Arial, Helvetica, sans-serif;
}
#container_hp{
width: 995px;
height: auto;
overflow:auto;
}
#f_tr{
height:auto;
}
#f_php{
width: 995px;
height: 60px;
}
#f_ph1{
width:325px;
float:left;
}
#f_ph2{
width:340px;
float:left;
}
#f_ph3{
width:325px;
float:left;
}
#footer {
font-size: 12px;
color: #fff;
background-image: url(/images/logos/ftr.jpg);
background-repeat: repeat-x;
height: 150px;
padding-bottom: -5px;
}
#callus {
padding-right: 30px;
}
#navi_newsl a:link {
color: #000;
text-decoration: none;
}
#navi_newsl a:visited {
text-decoration: none;
color: #000;
}
#navi_newsl a:hover {
text-decoration: underline;
color: #000;
}
#navi_newsl a:active {
text-decoration: none;
color: #000;
}
.oneColFixCtr #bannerint #callus h1 {
color: #7d6543;
}
.oneColFixCtr #bannerint #callus p {
color: #7d6543;
}
#warning {
background-image:url(/images/warning%20bar.png);
height: 50px;
background-repeat:no-repeat;
}
#intwarn {
margin: 13px;
}
#intwarn p {
color: #fff
}
#warning #intwarn p {
font-size: 20px;
}
.oneColFixCtr #page #content table {
text-align: left;
font-size: 12px;
}
.oneColFixCtr #page #content #col2 #hp_ftcol2news {
color: #FFF;
}
.oneColFixCtr #page #content #col2 #hp_ftcol2news p b {
color: #FFF;
text-decoration: underline;
}
如果有人对我如何阻止这些 div 过早切断(bannerph 和 ct)提出建议,我将非常感激。