ul li 水平方向の配置と垂直方向のセンタリングの問題に対する答えを探しています。ぜひアドバイスをお願いします。 _html/css_WEB-ITnose

我现在在写一个导航栏，用ul水平平铺，但是现在遇到了一个问题，就是要使我用float:left，那么在浏览器里放大页面会发现导航栏会乱掉，要使用display: inline;和white-space: nowrap;可以实现水平平铺，而且在浏览器中放大页面不会乱，但问题来了，用display: inline;和white-space: nowrap;后，里面的文字无法垂直居中，我是将ul放在一个div里面了，div想要让ul文字和图片在div里面垂直居中，并且横向排列（IE9无法垂直居中，Chrome就可以），这让人很郁闷，而用float:left就可以垂直居中。
现在有没有什么办法，既可以让ul里面的东西水平平铺，垂直居中而且在浏览器里面方法后不乱的。
代码如下：
HTML：

  
    
    
    
    


    




  
  
  
  

    
        

            

            
• 导航栏1

                
• 导航栏1

                

                
• 导航栏1

            
• 导航栏1

            

                
• 导航栏1

                

                
• 导航栏1

            

        

        
    

CSS:
.container{height: auto;}
/**トップメニュー**/
.nav{ height:40px;background:url(../画像/topbar_bg.gif) 繰り返し-x; マージン-トップ: 0px; 行の高さ: 40px;}
ul{リストスタイル: なし; ul li{ : 自動 20 ピクセル; カラー: #BFBFBF; 表示: インライン;
.navleft{}
.navright{color: #BFBFBF ; text-decoration: none;} /* 未訪問のリンク */
a:visited {color: #BFBFBF;border: none;} /* 訪問済みのリンク */
a:hover {color: #FFFFFF;border : none;} /* マウスがリンク上にあるとき */
a:active {color: #BFBFBF;border: none;} /* 選択されたリンク */
.menu_right{margin-left: 80px;}
.menu_left{widows : 1px; 高さ: 40px;}
.delimiter{background:url(../images/delimiter.png); 余白: 0px; 幅: 2px;


ディスカッションに返信(解決策)

1.

vertical-align:bottom;

を使用して画像の位置を調整します。
2.
rrree
を使用してフィールドの位置を調整します。

お二人ともありがとうございます。写真に問題があることがわかりました。私の写真の高さはわずか 35 ピクセルです。
画像の位置を調整しましたが、うまくいきませんでした

line-height:30px;

vertical-align:bottom;

を使用しましたが、別の問題が突然発生しました。IEでは縦線の画像が表示できるのに、Chromeでは表示できないのはなぜですか?引き続きアドバイスをお願いします