Question

我有宽度为500px的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>

Answer 1

尝试仅使用空格字符替换 。  阻止浏览器包装附加的单词。每个<a>都不会出现在新行上，但如果使用普通空格，它将不再适合其容器。

Answer 2

如果锚点之间没有空格，则认为它是一个字符串，因此无法换行。您可以尝试使用CSS规则word-wrap来帮助解决此问题，但某些浏览器可能不会遵循这样的设置。

简单的解决方案是将 更改为实际空格。或者使用<ul>并使用<li> display: inline;。后者可以说更具语义性。

Answer 3

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

 是一种强迫间距的顽皮方式;通过良好的CSS（在这种情况下，margin），您将获得更加一致和专业的结果。

Css div宽度问题

3 个答案: