0

所以我正在做一个带有各个部分的水平网站,效果很好,但是现在我添加了我的菜单,我遇到了麻烦,它只是破坏了我的整个内容区域和背景。我尝试过使用 z-index,它没有任何效果......并且在它之前放置项目也只是将其推出。

我的 CSS 导航栏

    #Navigation
{
margin: 0px;
padding: 20px 0px 0px 700px;
font-family: 'american_captainregular', Helvetica, Arial, sans-serif;
font-size: 55px;
float:left;
} 

#Navigation ul, #Navigation li
{
margin: 0;
padding: 0;
display: inline;
list-style-type: none;
}

#Navigation a:link, #Navigation a:visited
{
float: left;
line-height: 14px;
margin: 0 10px 4px 10px;
text-decoration: none;
color: #999;
}
#Navigation a:hover { color: #000; }

我的 CSS 图像

#HomeText{
background-repeat: no-repeat;
background-image: url(Images/HomeText.png);
float:left;
height:158px;
width:450px;
margin-left:461px;
margin-top:126px;

}

的HTML

<div id="Content">
<div class="Tabs TabOne" id="HomeTab">

<ul class="MyNav" id="Navigation">
<li><a href="#" class="home">Home</a></li>
<li><a href="#AboutTab" class="about">About</a></li>
<li><a href="#PortfolioTab" class="portfolio">Portfolio</a></li>
</ul>
    <div id="HomeText"></div>
</div>

以防万一,我的部分的 CSS

    .Tabs{
    margin:0px;
    bottom:0px;
    float:left;
    width:3500px;

}

.TabOne{
background: url(Images/BG1.jpg) no-repeat;
}

我从来没有遇到过这种元素被向下推到页面上的问题

http://jsfiddle.net/BoneStarr/AGfwn/

4

0 回答 0