-1

以下の画像を参照してください。

Chromeで表示されたWebサイト http://i48.tinypic.com/2rr9zf7.png

dreamweaverで表示されるWebサイト：http： //i50.tinypic.com/mcvey9.png

問題は、カルーセルが上部のナビゲーションバーと整列していないことです（右上を参照）。1mmずれているようです

私はそれがナビゲーションバーで何かをしなければならないかもしれないと信じています（2番目の画像を参照）。ご覧のとおり、連絡先ボタンは残りのボタンの下にあります。

私の理論では、カルーセルの位置がずれてしまいます。

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 に答える