イメージとアンカー、テキストをリンクするためのアラインメントの適用方法？

Question

イメージとアンカータグでHTMLを記述する必要があります。画像のサイズが等しくない。私がする必要があるのは、リンクテキスト 'プロジェクトを参照'を右側に並べることで、同じ垂直線/線になるようにすることです。ここに私のコードです。

<div> 
<ul> 
    <li><img src="images/layout/nokia.gif" /><a href="#">See projects</a></li> 
    <li><img src="images/layout/kpn.gif" /><a href="#">See projects</a></li> 
    <li><img src="images/layout/sla.gif" /><a href="#">See projects</a></li> 
</ul> 
</div> 

すべての画像は左側（長さが等しくない）です。私は、同じ垂直レベルで 'プロジェクトを見る'というリンクを表示したい。私に何ができる？何が最善の方法でしょうか？ここで

はJsFiddle http://jsfiddle.net/chhantyal/F9TA5/1/

上のコード

Answer 1

ul li 
{ 
    width:300px; 
} 
ul li a 
{ 
    float:right; 
} 

Answer 2

が

Answer 3

はあなたが垂直整列（下を使用したアンカータグに"float: right;"スタイルを追加してみてください、あなたのCSSに以下のコードを試してくださいです - >中または上またはnum％）

li img, li a{ vertical-align:bottom } 

Answer 4

更新フィドル：http://jsfiddle.net/chhantyal/F9TA5/1/

img { 
    width: 50px; */ for testing */ 
    height: 50px; */ for testing */ 
    border: 1px solid #ddd; */ for testing */ 
    display: block; 
    float: left; 
} 
li { 
    width: 300px; 
    clear: both; 
} 
a { 
    float: right; 
    padding: 18px 0 0 0; */ Adjust this to make anchors line up vertically 
}