2

我在 ExtJs 中有一个标题栏，其中有一个带有用户名的 div。我希望它出现在标题栏的右侧，我可以让它与'float：right;'有关 但在 FF 中，它会将文本放在一行中，因为它在 Chrome 中很好？

HTML：

<span unselectable="on" class="x-panel-header-text x-panel-header-text-default" id="programList_header_hd-textEl">Program Access permissions (TestResetValidity)<div class="programusername">Test Reset Validity</div></span>

CSS：

.programusername {
    position: relative;
    float: right;
    margin-right: 70px;
}

在此处输入图像描述

我怎样才能让它们在所有浏览器中都像这样排列，而不仅仅是 chrome（下）？

在此处输入图像描述

4

3 回答 3

3

首先，永远不要将块元素放在div像span.

您可以将正确的文本放在另一个 div 中，然后将其放在后面div#programusername，这将解决它。

此外，无需将位置更改为相对位置。

<div style="clear: both;">最后，在你用浮动衬里的元素后面放一个，以防止取代其他页面元素。

于 2013-03-15T16:05:17.603 回答
2

尝试添加overflow: hidden;到父级<span>

于 2013-03-15T15:59:44.640 回答
1

试试这个：

.programusername {
    position: relative;
    float: right;
    margin-right: 70px;
    display: inline-block;
}
于 2013-03-15T15:59:37.470 回答