2013-04-24 65 views
-2

我有,我在試圖把這項CSS結果不會中途.. 我嘗試編輯CSS在google.com 發現此刻的CSS問題,但仍不能,,,也許是因爲我的CSS的知識較少..如何讓這個CSS在中間?

它的這個HTML。

<div class='menu'> 
<a href='clearsessions.php'><span>Home</span></a> 
<a href='#'><span>Blog</span></a> 
<a href='#'><span>Buy Followers</span></a> 
<a href='#'><span>Contact</span></a> 
</div 

CSS

.menu:after, .menu:before { 
margin-top:0.5em; 
content: ""; 
float:left; 
border:1.5em solid rgba(0, 159, 234, 0.3);} 
.menu:after { 
border-right-color:transparent;} 
.menu:before { 
border-left-color:transparent; 
} 
.menu a:link, .menu a:visited { 
color:#fff; 
text-decoration:none; 
float:left; 
height:3.5em; 
overflow:hidden;} 
.menu span { 
background:rgba(0, 159, 234, 0.3); 
display:inline-block; 
line-height:3em; 
padding:0 1em; 
margin-top:0.5em; 
position:relative; 
-webkit-transition: background, margin 0.2s; 
-moz-transition: background, margin 0.2s; 
-o-transition: background-color, margin-top 0.2s; 
transition: background, margin 0.2s; 
} 
.menu a:hover span { 
background:rgba(0, 159, 234, 0.5); 
margin-top:0; 
} 
.menu span:before { 
content: ""; 
position:absolute; 
top:3em; 
left:0; 
border-right:0.5em solid #9B8651; 
border-bottom:0.5em solid rgba(0, 159, 234, 0.3); 
} 
.menu span:after { 
content: ""; 
position:absolute; 
top:3em; 
right:0; 
border-left:0.5em solid #9B8651; 
border-bottom:0.5em solid rgba(0, 159, 234, 0.3);} 

請幫助,, :(

+0

你想做什麼? – 2013-04-24 12:31:59

+0

添加一個鏈接到現場演示或JSFiddle將有助於很多事情。此外,縮進你的CSS會使讀起來更容易。 一個小小的觀察:你的結束標記'<\div>'缺少它的右側括號。 – Dre 2013-04-24 12:34:59

回答

0

你需要把它添加到你的CSS:

.menu{ 
    position: relative; 
    left: 50%; 
    margin-left: -212px; 
} 

你需要找到準確的保證金左PX的

+0

好的,,,謝謝:) – user2286089 2013-04-24 12:53:50

+0

Makasih Banyak ... :) =非常感謝你.. :) – user2286089 2013-04-24 12:57:24