0

我在网页中有以下输出(黑色突出显示的区域包含敏感数据):

提供者截图

除了最长的行后面总是有另一个空白行之外,每一行都正确显示。

这是代表一行的代码:

<div style="clear:both; white-space:nowrap;">
    <span style="float:left; margin-right:5px">
    <a class="provider" href="javascript:void(0)" 
        onkeypress="showProviderInfo(this, 'claim2')"
            onclick="showProviderInfo(this, 'claim2')">[+]</a>
    THE ENTRY WITH THE LONGEST NAME CAUSES AN EXTRA LINE TO DISPLAY BELOW IT...
    </span>
    <span style="float:right">
        <a href="javascript:void(0)"
        onkeypress="openAddWindowForMedicalProvider('12345678')"
        onclick="openAddWindowForMedicalProvider('12345678')">
    Create as Medical Provider
    </a>
    &nbsp;
    <a href="javascript:void(0)"
        onkeypress="openAddWindowForServiceProvider('12345678')"
        onclick="openAddWindowForServiceProvider('12345678')">
    Create as Service Provider
    </a>
    </span>
</div>
<br />

我怎样才能设置这个样式,使得多余的行不会出现在最长的行之后?

4

1 回答 1

1

使用 jsfiddle.net 对我来说这似乎很好用

但是,你们都有</ div><br />。Adiv自动获取一个新行,因此它br是多余的,可能会导致您的问题。

此外,<span style="float:left; margin-right:5px">可能会导致问题。浮动和边距并不总是符合您的预期。也许将其更改为padding-right或查看如果您完全删除间距并放入一对&nbsp;以查看是否有效会发生什么。

无论如何,您都不需要向左浮动该跨度。

在多个浏览器中测试它也可能会有所帮助。这可能是浏览器的事情。IE 可能会弄乱在 Firefox 或 Chrome 中正常工作的东西。

于 2012-04-10T14:54:43.193 回答