この CSS のビットに問題があり、それを見つけることができないようです。
私は少しPHPを持っています：
<ul>
<?php if($page=="home"){echo"<li class='active'>";}else{echo"<li>";}?><a href="http://www.trevorpeyton.com/" alt="Home page">Home</a></li>
<?php if($page=="about"){echo"<li class='active'>";}else{echo"<li>";}?><li><a href="http://www.trevorpeyton.com/about/" alt="Learn all about me">About</a></li>
<?php if($page=="contact"){echo"<li class='active'>";}else{echo"<li>";}?><li><a href="http://www.trevorpeyton.com/contact/" alt="Contact me">Contact</a></li>
<?php if($page=="projects"){echo"<li class='active'>";}else{echo"<li>";}?><li><a href="http://www.trevorpeyton.com/projects/"alt="View projects I am working on/completed">Projects</a></li>
<?php if($page=="sites"){echo"<li class='active'>";}else{echo"<li>";}?><li><a href="http://www.trevorpeyton.com/sites/" alt="View websites I have made">Sites</a></li>
<?php if($page=="demo"){echo"<li class='active'>";}else{echo"<li>";}?><li><a href="http://www.trevorpeyton.com/demo/" alt="Demo the new user features">Demo</a></li>
</ul>
これで、各ページで が定義されます$page。問題は、ページがアクティブなときにアイテムの下にバーが表示されることです。バーはページの右側に浮かんでいて、ホーム アイテムは右端にあります。それがアクティブであれば、問題なく動作します。他のアイテムのいずれかがアクティブな場合、線は左側にあります。ここに私のCSSがあります:
#header {
position:fixed;
background:#222;
color:#999;
width:100%;
margin:0px;
padding:0px;
top:0;
z-index:1;
height:5%;
}
#header ul li{
display: inline;
margin:0;
float:right;
display:block;
padding:5px 10px;
}
#header .active{
border-bottom: solid 3px orange;
}
右
違う
間隔と関係があることは知っていますが、それを理解することはできません。私は CSS の専門家ではありません。