如何讓圖片正確，中等？

http://imageshack.us/scaled/thumb/248/image4.gif

一些菜單（S）有子菜單（S），在這種情況下，我需要一個小的紅色箭頭。但是，正如你所看到的，它會延續到最長項目的新線;它不居中。這是我的嘗試：

<a href="/fax">&nbsp; 
    <span>flick&nbsp;</span><span style="float: right; vertical-align: middle;"><img src="/design/right.gif" width="4" height="7" /></span> 
</a>

（在實際代碼中沒有換行和空格，只是要更容易閱讀）

在這種情況下，箭頭做雲的權利，但不是在中間，但是，頂部 - 在最後一個菜單項的情況下，它將進入底部：S

來源

2012-11-26 user893856

請將您的代碼和所有css粘貼到http://jsfiddle.net/上。這樣我們就可以確切地看到您現在擁有什麼以及如何修復您的結果。 –

給出一個line-heigth: 20px;（例如..根據您的speccs玩不同的高度）。只有這樣才能垂直對齊。

此外：什麼與 和高度和寬度屬性。你正在使用CSS，無處不在。

用style="left: 1em;"代替。將跨度上的替換爲style="padding-right: 1em;"。用它們的CSS等價物替換高度/寬度屬性。

來源

2012-11-26 11:54:41

行高無效 – user893856

它應該。儘管那裏的所有元素都應該有垂直對齊：中間。另外：給你的容器（A的父親）一個固定的，這是足夠大，並做一個'display：inline-block;寬度：100％;' –

我會添加位置：相對於一個標籤和位置：絕對的圖像。

來源

2012-11-26 11:54:42

爲此，您必須添加浮點數：左至第一個跨度，如下所示。

<a href="/fax">&nbsp;<span style="float:left;">flick&nbsp;</span><span style="float: right; vertical-align: middle;"><img src="D:/wamp/www/xplifeline/application/images/default.jpg" width="4" height="7" /></span></a>

來源

2012-11-26 12:05:27

thx但仍然沒有效果 – user893856

我有這樣的：

<ul id="nav"> 
<li>Menu 1 
    <ul class="nav first"> 
     <li>Menu 1</li> 
     <li>Menu 2</li> 
     <li>Menu 3</li> 
     <li>Menu 4 
     <ul class="nav"> 
      <li>Menu 1</li> 
      <li>Menu 2</li> 
      <li>Menu 3</li> 
      <li>Menu 4</li> 
     </ul> 
    </li> 
    </ul> 
</li> 
<li>Menu 2</li> 
<li>Menu 3</li> 
<li>Menu 4</li>

從這裏：http://jsfiddle.net/y9jbQ/

現在看起來：

<span style="float: left; line-heigth: 40px; vertical-align: middle; display: inline-block;">&nbsp;menu&nbsp;</span><span style="float: right; line-heigth: 40px; vertical-align: middle;"><img src="/design/right.gif" width="4" height="7" /></span>

現在的結果：http://s12.postimage.org/muw3hehyh/Image4.gif?noCache=1353932739

來源

2012-11-26 12:26:46 user893856

如何讓圖片正確，中等？

回答

相關問題