Q

CSS對齊多個文本部分

html
css

2012-08-27 65 views 0 likes

0

我想對齊三個文本部分，其中中間部分有一個最大寬度，可以使用文本溢出：ellipsis屬性截斷。CSS對齊多個文本部分

例如該網站| www.aLongNameShouldBeTruncated.com |正在打開

應該這樣排列：

enter image description here

我可以得到它的Chrome瀏覽器，看到http://jsfiddle.net/LSuRx/5/：

但我不能拿到三個部分垂直對齊很好在IE9和Firefox：

enter image description here

任何人都知道我可以解決這個？

2012-08-27 GarethOwen

A

回答

1

工作對我來說，您可以添加到vertical-align: bottom;#addressContainer。

2012-08-27 10:00:22 Ariel

1

我嘗試將vertical-align: top;添加到#addressContainer塊中。

這下FF 14和Opera 12

2012-08-27 09:59:59 Chris

1

給vertical-align：頂部到您的span。像這樣寫：

span{vertical-align:top;}

入住這http://jsfiddle.net/LSuRx/7/

2012-08-27 10:00:43 sandeep

1

這個工作對我來說：

<style type="text/css"> 
div.ord{ 
    white-space: nowrap; 
    overflow: hidden; 
    float: left; 
} 

div.elip{ 
    max-width: 100px; 
    text-overflow: ellipsis; 
} 
</style> 

<div class="ord">Text 1</div> 
<div class="ord elip">Your long address text will be here</div> 
<div class="ord">Text 2</div>

2012-08-27 12:52:22

相關問題