一個div中的span類？

我試圖在同一行上得到兩行文本，一個在左側，另一個在右側。一個div中的span類？

CSS：

.topbar { 
    background-image:url(images/bar_bg.png); 
    height:62px; 
} 

.topbar span{ 
    font-family:Arial; 
    font-weight:bold; 
    font-size:15px; 
    color:#494963; 
    margin: 0; 
    padding-left:280px; 
    padding-top:15px; 
} 

.topbar span.left{ 
    font-family:Arial; 
    font-size:15px; 
    color:#494963; 
    margin: 0; 
    padding-right:380px; 
    padding-top:15px; 
}

HTML：

<div class="topbar"> 
    <span class="left">Contact Us or Come see us at our Branch</span> 
    <span>11 HIGH STREET, TOWN CENTER, Bristol, BA140IO </span> 
</div>

來源

2012-07-23 Spike

您可能需要跨度CSS設置爲：

display: inline-block !important;

我有問題，其中跨度繼承父股利或類似的問題，其中包含的CSS文件中有塊顯示屏更改了跨度顯示類型默認值。

通過設置爲內聯塊，跨度應該按預期顯示，而不使用浮點數。就我個人而言，我儘可能地避免浮動。

這裏的佈局是怎麼想的工作一個很好的例子： div and span: display = 'block', 'inline', or 'inline-block' ?

來源

2012-07-23 20:30:42

不錯的選擇。 – JAB 2012-07-23 20:36:20

我更經常使用這種方法，因爲我不必爲IE清除或特殊情況。 – 2012-07-23 20:50:40

用你的float屬性！：]

span { 
float: right; 
} 

span.left { 
float: left; 
}

（不要忘記清除如果必要的話！）

來源

2012-07-23 20:23:41

我不想讓他們在雖然屏幕的邊緣？這就是爲什麼我使用填充 – Spike 2012-07-23 20:27:44

將填充應用於父元素。 – 2012-07-23 20:28:27

@ user1411322然後適當調整你的'div'。 – JAB 2012-07-23 20:28:31

很簡單的。您需要利用CSS float屬性。

http://jsfiddle.net/4cTFP/

來源

2012-07-23 20:25:02 JAB

一個div中的span類？

回答

相關問題