1
我正在設計一個居中頁面，但我的菜單並不完全居中。這有點接近右側。我看不出爲什麼這樣。請你幫忙？靈活頁面的定位菜單
感謝您的任何幫助。
CSS
body {
margin-left: auto;
margin-right: auto;
text-align:center;
background: #ffffff }
div.wrap {
max-width:800px;
min-width:400px;
margin: 0px auto;
border: 1px dashed red; }
div.inner-wrap {
overflow: auto;
margin: 30px;
border: 1px dashed #222; }
div.header {
padding-top: 1pc;
text-align:center;
width:100%;
color: #000000;}
div.menu {
list-style:none;
margin:0;
padding:0;
width:100%;
text-align:center;
background:#FBB117;}
div.menu ul{
margin-left: auto;
margin-right: auto;
margin-top: 3px;
margin-bottom: 3px;
width: 100px
padding:0;
display:inline-block;}
div.menu li{
display:inline; }
div.menu li a{
text-decoration:none;
padding:7px 0;
width:100px;
background:#FBB117;
color:#4C4646;
float:left;
text-align:center; }
div.menu li a:hover{
background:#a2b3a1;
color:#000 }
div.content {
padding-top: 2pc;
text-align:left;
margin-left: 50px;
margin-right: 50px;
color: #000000 }
div.content p {
color: #493831;
padding-bottom: 30px;
margin: 0;}
div.sidebar {
margin-right: 15%;
padding-top: 2pc;
text-align:center;
float: right;
width: 200px;
color: #000000;
list-style:none; }
div.sidebar ul{
margin-left: auto;
margin-right: auto;
margin-top: 3px;
margin-bottom: 3px;
padding:0;
list-style: none;
display:inline-block; }
div.sidebar li{
display:inline; }
div.sidebar li a{
text-decoration:none;
padding:10px 0;
width:100%;
background:#FBB117;
color:#4C4646;
float:right;
text-align:center;
border-bottom:1px solid #fff;}
div.sidebar li a:hover{
background:#a2b3a1;
color:#000 }
HTML代碼是在這裏：
<body>
<div class="wrap">
<div class="inner wrap">
<div class="header">
<img src="realimg1.jpg" class="real" alt="king">
<h1>xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx</h1>
</div>
<div class="menu">
<ul>
<li><a href="link1.html">xx</a></li>
<li><a href="link1.html">xxxx</a></li>
<li><a href="link1.html">xxxxxxx</a></li>
<li><a href="link1.html">xxxxxxxxx</a></li>
<li><a href="link1.html">xx</a></li>
<li><a href="link1.html">xxxxxx</a></li>
</ul>
</div>
<div class="content">
<p>
<img src="img1.jpg" class="bw" alt="king">
The CC is one of the oldest continually operating chess club in
the Southern Hemisphere.We can proudly boast that we have been open daily since 1990 and we inted to
maintain that tradition. On any night, you will find members of the club playing casual games or
participating in one of our manly regulary scheduled tournaments. We are family club, and offer competition and
instruction suitable for chess players of all skill levels and age groups.</p>
<p>No other club in texas can boast a history so rich. Winning the club champion championships is your
chance to get amongst these greats, and be immortalized foreve on the honow boards.</p>
<p>Throughout the year, Chess Club 'traditional time control' FIDE rated events form, whereby
a player's scores from all 9 events will add up to form a grand prix score at the end of the year.The tournaments included are:
Australia Day Weekender, Chess Club Championship,ANZAC Day Weekender, City Of Brisbane Open, Edwin Malitis Memorial, Chess Club Open , Chess Club Cup Weekender
</div>
<div class="sidebar">
<ul>
<li><a href="link1.html">xxx</a></li>
<li><a href="link1.html">xxxxxxxxx</a></li>
<li><a href="link1.html">xxxxxxx</a></li>
<li><a href="link1.html">xxxxxx</a></li>
<li><a href="link1.html">xxxxxxxxx</a></li>
<li><a href="link1.html">xxxxxxxxxx</a></li>
<li><a href="link1.html">xxxxxxxx</a></li>
<li><a href="link1.html">xxxxx</a></li>
<li><a href="link1.html">xxxx</a></li>
<li><a href="link1.html">xxxxxxxxxxxx</a></li>
<li><a href="link1.html">xxxxxxxx</a></li>
</ul>
</div>
</div>
</div>
</body>
我們需要相應的HTML代碼。請發表小提琴例如或鏈接到在線頁面 – FelipeAls 2012-04-19 00:19:42
我不知道如何保存小提琴併發送鏈接。我也添加了html代碼。我感謝您的幫助。 – pepsicode 2012-04-19 00:29:49
@pepsicode jsfiddle中的'save'按鈕通常可以很好地保存。 – Petah 2012-04-19 00:30:39