Html 导航菜单屏幕大小问题

Html 导航菜单屏幕大小问题,html,css,Html,Css,我正在使用导航菜单。它没有下拉菜单,只是一个普通的老式水平导航菜单。我遇到的问题是,当页面加载到1280 x 768屏幕上时,菜单文本看起来明显更大,这导致菜单项被下推到下一级。在我的1600 x 900屏幕上,一切看起来都很好。我在两台电脑之间使用Firefox。一台电脑是Windows 7,一台是Windows Xp。我认为它可能是Cleartype,但禁用它并没有解决问题。文本间距是另一个想法,但设置也不能解决问题。如果需要,我可以发布代码,但我觉得我已经排除了这种可能性 <div

我正在使用导航菜单。它没有下拉菜单,只是一个普通的老式水平导航菜单。我遇到的问题是,当页面加载到1280 x 768屏幕上时,菜单文本看起来明显更大,这导致菜单项被下推到下一级。在我的1600 x 900屏幕上,一切看起来都很好。我在两台电脑之间使用Firefox。一台电脑是Windows 7,一台是Windows Xp。我认为它可能是Cleartype,但禁用它并没有解决问题。文本间距是另一个想法,但设置也不能解决问题。如果需要,我可以发布代码,但我觉得我已经排除了这种可能性

 <div class="wrapper clearfix">
<nav>
    <ul id="nav" class="sf-menu">
        <li ><a href="index.php">Home</a></li>
        <li><a href="loans.php">Loans</a></li>  
        <li><a href="checkings.php">Checkings</a></li>
        <li><a href="credit.php">Credit Cards</a></li>
        <li><a href="debit.php">Debit Cards</a></li>
        <li><a href="savings.php">Savings</a></li>
        <li><a  href="member_ed.php">Member Education &amp; Calulators</a></li>
        <li><a href="about.php">About Us</a></li>
        <li><a href="vehicles.php">Vehicles &amp; Homes</a></li>
        <li><a id="last_item" href="">Mortgages</a></li>
    </ul>

</nav>
</div>
}


单词之间没有边距,所以应该是相同的宽度。

以防任何人遇到此问题。这确实是我使用的网页字体的问题。在不同的大小,它有不同的间距。当我改变字体时,我没有这个问题

请包括相关的HTML和CSS样式。听起来您的项目是浮动的,而容器没有固定的宽度,因此当您的视口较小时,它会自动换行,当您的视口较大时,它不会自动换行。您指定的布局宽度以像素为单位,字体大小以
pt
s为单位
1pt
为1/72英寸,如果屏幕密度不是72ppi,则不总是1像素。好的,我添加了代码。我的包装是一个固定的940px。
 nav{
margin-top: 0px;
height: 30px;
 }


 nav a{
text-decoration: none;
 }

 #nav li{
float:left;
}

 #nav>li>a{
font-family:'Yanone Kaffeesatz', Arial, sans-serif;
font-size: 1.35em;
letter-spacing:.05em;
 }
 .wrapper {
width: 940px;
-webkit-text-size-adjust: 100%; /* Stops Mobile Safari from auto-adjusting font-sizes */