2010-11-03 64 views
1

我有500像素寬的div一個包含多個錨...問題錨固件不包裹在以多行....我嘗試使用表,以及同樣的問題....的CSS的div寬度問題

<div style="width:500px;"> 
    <a href="#procrit">procrit</a>&nbsp; 
    <a href="#doxil">doxil</a>&nbsp; 
    <a href="#prezista">prezista</a>&nbsp; 
    <a href="#simponi">simponi</a>&nbsp; 
    <a href="#reopro">reopro</a>&nbsp; 
    <a href="#topamax">topamax</a>&nbsp; 
    <a href="#invega">invega</a>&nbsp; 
    <a href="#axert">axert</a>&nbsp; 
    <a href="#aciphex">aciphex</a>&nbsp; 
    <a href="#concerta">concerta</a>&nbsp; 
    <a href="#risperdal">risperdal</a>&nbsp; 
    <a href="#remicade">remicade</a>&nbsp; 
    <a href="#velcade">velcade</a>&nbsp; 
    <a href="#doxil">doxil</a>&nbsp; 
    <a href="#regranex">regranex</a>&nbsp; 
    <a href="#nucynta">nucynta</a>&nbsp; 
    <a href="#duragesic">duragesic</a>&nbsp; 
    <a href="#leustatin">leustatin</a>&nbsp; 
    <a href="#invega">invega</a>&nbsp; 
    <a href="#sustenna">sustenna</a>&nbsp; 
    <a href="#reminyl">reminyl</a>&nbsp; 
    <a href="#natrecor">natrecor</a>&nbsp; 
</div> 
+0

您需要通過用四個空格縮進來將HTML格式化爲代碼。您將可以使用''標籤。另外,請添加換行符。 – SLaks 2010-11-03 02:37:28

+0

我不希望每一個錨點在新行中......在超過指定寬度後它必須在下一行... – Rajesh 2010-11-03 02:38:36

+1

你應該在代碼中添加換行符,以便人們可以閱讀它。 – SLaks 2010-11-03 02:45:05

回答

1

如果錨點之間沒有空白,則認爲它是全部一個字符串,因此無法換行。您可以嘗試使用CSS規則word-wrap來解決這個問題,但有些瀏覽器可能不會遵守這樣的設置。

簡單的解決方案是將&nbsp;更改爲實際空格。或者使用<ul>並具有<li>display: inline;。後者可以說是更多的語義。

+0

這就是我添加的原因  – Rajesh 2010-11-03 02:39:33

+2

' '是一個* non-breaking space *,因此仍然不會中斷。 – 2010-11-03 02:40:36

6

嘗試用空格字符替換&nbsp;&nbsp;可以防止瀏覽器打包它附加的文字。每個<a>不會出現在新行上,但如果使用普通空格,它將不再適合其容器,則它將成功包裝。

0

float:left;margin-right:5px使用

&nbsp;是調皮辦法迫使間距;你會得到更加一致和專業的結果與良好的CSS(在這種情況下,margin)。