2012-06-14 26 views
1

我有一個使用HTML的項目符號列表,如果句子進入兩行,我希望文字排成一行。如果文本進入第二行,則它與子彈排成一列。我希望它與文本一致。HTML項目符號文本邊距,不排隊

這裏是我的意思是:

Bullet Text Example

這裏是我使用的代碼:

Bullet Text Code

+0

哇!擺脫所有可怕的內聯樣式! –

+0

您的代碼在我的瀏覽器(Firefox 13)中按預期工作... –

+1

爲什麼不簡單地使用像任何理智的人一樣體面的,正常的無序列表? –

回答

0

你的代碼是太可怕了!如果您需要所有列表項的類似樣式,請爲所有列表項使用通用樣式表!內部div和跨度沒有理由!

<style type="text/css"> 
    li { 
     font-size: 14pt; 
     font-family: "Times New Roman", sans-serif; 
    } 
</style> 
<ul> 
    <li> event will be held from 10am - 5pm bring your dog with</li> 
    <li> $8 entrance fee (print out your flyer that you received and bring it with you to support your favorite rescue 
    </li> 
    (kids under 12 are free) $5 of you entrance fee will go to that dog rescue or organization </li> 
    <li> must bring current vaccination paperwork, no exceptions, dogs will not be allowed in without this paperwork 
    </li> 
    <li> no firearms, alcoholic beverages, outside food or drink, coolers or glass containers</li> 
    <li> bags will be checked prior to entrance</li> 
    <li> event will be photographed &amp; videotaped</li> 
    <li> all dogs must have rabies tags attached to collars</li> 
    <li> collars must be worn at all times, no metal collars of any kind allowed</li> 
    <li> owners/handlers are legally responsible for the behavior/actions of their dogs</li> 
    <li> only 1 dog allowed per adult handler</li> 
    <li> dogs must be healthy, fully immunized, de-wormed, &amp; wearing id tags</li> 
    <li> female dogs in heat are not permitted</li> 
    <li> dogs must be leashed at all times unless in dog play area, owners must watch their dog in this area at all 
     times 
    </li> 
    <li> owners must immediately clean up after their dogs, with a paper or plastic bag</li> 
    <li> aggressive dogs will be asked to leave</li> 
    <li> muzzled dogs not allowed</li> 
    <li> owners must keep their dogs under control at all times</li> 
    <li> children must be closely supervised</li> 
    <li> please dispose of cigarette butts in proper areas, smoking not allowed in any building</li> 
    <li> people who do not follow the rules will be asked to leave immediately</li> 
</ul> 
0

代碼的結尾是稍有不妥。你應該在<\ul>之前關閉你的<\li>,而不是相反。試試這個:

<TABLE style="BORDER-COLLAPSE: collapse; MARGIN-RIGHT: 8px"> 
<TBODY> 
<TR> 
<TD> 
<UL> 
<LI> 
<DIV align=justify><SPAN style="FONT-SIZE: 14pt"><SPAN style="FONT-FAMILY: Times New Roman; FONT-SIZE: 14pt">Event will be held from 10am - 5pm Bring Your Dog With</SPAN></SPAN> </DIV> 
<LI> 
<DIV align=justify><SPAN style="FONT-SIZE: 14pt"><SPAN style="FONT-FAMILY: Times New Roman; FONT-SIZE: 14pt">$8 Entrance Fee (print out your flyer that you received and bring it with you to support your favorite Rescue (kids under 12 are FREE) $5 of you entrance fee will go to that dog rescue or organization</SPAN></SPAN> </DIV> 
<LI> 
<DIV align=justify><SPAN style="FONT-SIZE: 14pt"><SPAN style="FONT-FAMILY: Times New Roman; FONT-SIZE: 14pt">MUST bring Current Vaccination Paperwork, NO EXCEPTIONS, dogs will not be allowed in without this paperwork</SPAN></SPAN></DIV> 
<LI> 
<DIV align=justify><SPAN style="FONT-SIZE: 14pt"><SPAN style="FONT-FAMILY: Times New Roman; FONT-SIZE: 14pt">No firearms, alcoholic beverages, outside food or drink, coolers or glass containers</SPAN></SPAN></DIV> 
<LI> 
<DIV align=justify><SPAN style="FONT-SIZE: 14pt"><SPAN style="FONT-FAMILY: Times New Roman; FONT-SIZE: 14pt">Bags will be checked prior to entrance</SPAN></SPAN></DIV> 
<LI> 
<DIV align=justify><SPAN style="FONT-SIZE: 14pt"><SPAN style="FONT-FAMILY: Times New Roman; FONT-SIZE: 14pt">Event will be photographed &amp; videotaped</SPAN></SPAN></DIV> 
<LI> 
<DIV align=justify><SPAN style="FONT-SIZE: 14pt"><SPAN style="FONT-FAMILY: Times New Roman; FONT-SIZE: 14pt">All dogs MUST have rabies tags attached to collars</SPAN></SPAN></DIV> 
<LI> 
<DIV align=justify><SPAN style="FONT-SIZE: 14pt"><SPAN style="FONT-FAMILY: Times New Roman; FONT-SIZE: 14pt">Collars MUST be worn at all times, NO METAL COLLARS of any kind&nbsp;allowed</SPAN></SPAN></DIV> 
<LI> 
<DIV align=justify><SPAN style="FONT-SIZE: 14pt"><SPAN style="FONT-FAMILY: Times New Roman; FONT-SIZE: 14pt">Owners/Handlers are legally responsible for the behavior/actions of their dogs</SPAN></SPAN></DIV> 
<LI> 
<DIV align=justify><SPAN style="FONT-SIZE: 14pt"><SPAN style="FONT-FAMILY: Times New Roman; FONT-SIZE: 14pt">Only 1 dog allowed per adult handler</SPAN></SPAN></DIV> 
<LI> 
<DIV align=justify><SPAN style="FONT-SIZE: 14pt"><SPAN style="FONT-FAMILY: Times New Roman; FONT-SIZE: 14pt">Dogs must be healthy, fully immunized, de-wormed, &amp; wearing ID tags</SPAN></SPAN></DIV> 
<LI> 
<DIV align=justify><SPAN style="FONT-SIZE: 14pt"><SPAN style="FONT-FAMILY: Times New Roman; FONT-SIZE: 14pt">Female dogs in heat are NOT permitted</SPAN> </SPAN></DIV> 
<LI> 
<DIV align=justify><SPAN style="FONT-SIZE: 14pt"><SPAN style="FONT-FAMILY: Times New Roman; FONT-SIZE: 14pt">Dogs MUST be leashed at all times unless in dog play area, owners must watch their dog in this area at all times</SPAN></SPAN> </DIV> 
<LI> 
<DIV align=justify><SPAN style="FONT-SIZE: 14pt"><SPAN style="FONT-FAMILY: Times New Roman; FONT-SIZE: 14pt">Owners MUST IMMEDIATELY clean up after their dogs, with a paper or plastic bag</SPAN> </SPAN></DIV> 
<LI> 
<DIV align=justify><SPAN style="FONT-SIZE: 14pt"><SPAN style="FONT-FAMILY: Times New Roman; FONT-SIZE: 14pt">AGGRESSIVE dogs will be asked to leave</SPAN> </SPAN></DIV> 
<LI> 
<DIV align=justify><SPAN style="FONT-SIZE: 14pt"><SPAN style="FONT-FAMILY: Times New Roman; FONT-SIZE: 14pt">MUZZLED dogs NOT allowed</SPAN> </SPAN></DIV> 
<LI> 
<DIV align=justify><SPAN style="FONT-SIZE: 14pt"><SPAN style="FONT-FAMILY: Times New Roman; FONT-SIZE: 14pt">Owners MUST keep their dogs under control at all times</SPAN> </SPAN></DIV> 
<LI> 
<DIV align=justify><SPAN style="FONT-SIZE: 14pt"><SPAN style="FONT-FAMILY: Times New Roman; FONT-SIZE: 14pt">Children MUST be closely supervised</SPAN></SPAN> </DIV> 
<LI> 
<DIV align=justify><SPAN style="FONT-SIZE: 14pt"><SPAN style="FONT-FAMILY: Times New Roman; FONT-SIZE: 14pt">Please dispose of cigarette butts in proper areas, smoking not allowed in any building</SPAN> </SPAN></DIV> 
<LI> 
<DIV align=justify><SPAN style="FONT-FAMILY: Times New Roman; FONT-SIZE: 14pt">People who do not follow the rules will be asked to leave immediately</SPAN> </DIV> 
</LI></UL></TD></TR></TBODY></TABLE></DIV> 
0

你不需要任何div。你只需要設計你的ul的樣式。像這樣:

ul.out{ 
list-style:disc outside none; 
} 
0

你忘了關每一個LI標籤..

,而不是這樣的:

<LI> 
<DIV align=justify><SPAN style="FONT-SIZE: 14pt"><SPAN style="FONT-FAMILY: Times New Roman; FONT-SIZE: 14pt">Event will be held from 10am - 5pm Bring Your Dog With</SPAN></SPAN> </DIV> 
<LI> 
<DIV align=justify><SPAN style="FONT-SIZE: 14pt"><SPAN style="FONT-FAMILY: Times New Roman; FONT-SIZE: 14pt">$8 Entrance Fee (print out your flyer that you received and bring it with you to support your favorite Rescue (kids under 12 are FREE) $5 of you entrance fee will go to that dog rescue or organization</SPAN></SPAN> </DIV> 

去這樣的:

<LI> 
<DIV align=justify><SPAN style="FONT-SIZE: 14pt"><SPAN style="FONT-FAMILY: Times New Roman; FONT-SIZE: 14pt">Event will be held from 10am - 5pm Bring Your Dog With</SPAN></SPAN> </DIV> 
</LI> 
<LI> 
<DIV align=justify><SPAN style="FONT-SIZE: 14pt"><SPAN style="FONT-FAMILY: Times New Roman; FONT-SIZE: 14pt">$8 Entrance Fee (print out your flyer that you received and bring it with you to support your favorite Rescue (kids under 12 are FREE) $5 of you entrance fee will go to that dog rescue or organization</SPAN></SPAN> </DIV> 
</LI> 

也嘗試保持您的標籤小寫。
我不確定,但我相信這是建議。

爲了確保行只是去,而不是突破到下一行,嘗試設置這樣的:

ul { 
overflow: auto; 
} 

在你的CSS