-1

见下图：

在 chrome 中查看的网站 http://i48.tinypic.com/2rr9zf7.png

在 Dreamweaver 中查看的网站：http: //i50.tinypic.com/mcvey9.png

问题是轮播没有与顶部的导航栏对齐（见右上角）。它似乎偏离了 1 毫米

我相信它可能与导航栏有关（参见第二张图片）。如您所见，联系人按钮位于其余按钮下方。

我的理论是它导致轮播不对齐。

HTML：

<!DOCTYPE HTML>

<html>

<head>

<link href="../CSS/styles.css" rel="stylesheet" type="text/css">
<link href='http://fonts.googleapis.com/css?family=PT+Sans+Caption' rel='stylesheet' type='text/css'>

</head>

<body>

<div id="outer">

<a href="file:///C|/Users/Callum/Desktop/desktop/website folder/WEBSITE/main.html"><img src="../Images/webimages/banner top.jpg"  /></a>

</div>

<div id="topnav">

<ul id="list-nav">

    <li><a href="#">Home</a></li>
  <li><a href="#">About Us</a></li>
  <li><a href="#">Services</a></li>
  <li><a href="#">Technologies</a></li>
  <li><a href="#">Contact</a></li>

  </ul>

</div>

<div id="carousel">

<iframe src="../Carousel/HTML/carousel.html" height="280" width="900" scrolling="no" frameborder="0"> </iframe>

</div>
<div id="mainbody">  
<div id="bigbuttons">

<img src="../Images/webimages/Meettheteam.jpg">

</div>
</div>
</div>

</body>

</html>

CSS：

/* Reset */

a img {
 border: none;
}

html, body {
    padding:0;
    margin:0;
    }

a {
text-decoration: none;
}

ul, li {
    list-style-type: none;
}

img.floatLeft { 
    float: left; 
    margin: 0px; 
}

*
{
   margin:  0;
   padding: 0;
}

body {background-color:#F1F1F1; }

#outer { width: 900px; margin: auto; }

#topnav { width: 900px; margin: auto; }

#mainbody { width: 900px; margin:auto; clear:both; } 

#list-nav li{display:inline-block;width:20%;float:left;}

#carousel { width: 900px; height: 280px; margin:auto; clear:both; }

#bigbuttons { width: 220px; height: 80px; margin:auto; margin-top: 9px; clear:both; float:left }

ul#list-nav li a {
 text-decoration:none;
 font-family:Arial, Helvetica, sans-serif;
 padding:5px 0;
 width: auto;
 background:#999;
 color:#eee;
 float: left
}

ul#list-nav li a {
  text-align:center;
  border-left: 1px solid #fff;
  width: 100%;
}

ul#list-nav li a:hover {
  background:#CCC;
  color:#ffff;
}

ul#list-nav li a:hover {
  background:#CCC;
  color:#ffff;
}

#content-fullwidth { width:100%; }​
4

1 回答 1

0

检查您正在填充 iframe 的轮播代码。看起来您的问题在那里，而不是您提供给我们的代码。

于 2012-10-15T20:08:11.687 回答