Html 在Mozilla firefox的下一行中出现div后面的元素

我在DIV内有一个文本框，DIV外有一个按钮。我需要两者（文本框和按钮）在同一行。在InternetExplorer中，这两种浏览器是同一条线。但是，在Mozilla中，button将出现在下一行中。附件是截图

图像：

aspx/HTML代码：

<div class="fileInputs">
<asp:FileUpload class="hiddenFile" ID="fucAttachment" runat="server" onmouseout="copyContents('fucAttachment');" />
<div class="visibleField">
    <input type="text" readonly="readonly" id="visibleAttachmentField" style="width: 158px; height: 18px; margin-left: -4px;" />
</div>
<input type="button" class="browseBtn" value="Browse"/>

---

你为什么不把按钮放在div里呢

将两个输入向左浮动。如果您的容器div将被定位为绝对值，则还需要为容器div指定宽度

---

如果您需要不可见的文本/输入，只需将其作为目标，而不是整个分区。

请显示实际的HTML代码–在讨论客户端问题时，服务器端不感兴趣的任何内容。与服务器端无关。这纯粹是一个对齐问题，一些CSS问题。它只发生在Mozilla中，而且你的按钮CSS有两个位置：绝对和浮动：对；你不应该这样做。“与服务器端无关”——是的，我知道——这就是为什么我要求你不要发布服务器端代码（ASP），而是发布客户端实际收到的HTML代码。

 div.fileInputs
    {
        position: relative;
        z-index: 0;
    }
    .hiddenFile
    {
        position: relative;
        text-align: right;
        -moz-opacity: 0;
        filter: alpha(opacity: 0);
        opacity: 0;
        z-index: 2;
        width: 220px;
        /*cursor: pointer; cursor: hand; */
    }
    .visibleField
    {
        position: absolute;
        top: 0px;
        left: 0px;
        z-index: 1;
        margin-left: 4px;
        display: inline-block;            
    }
    .browseBtn, .uploadBtn
    {
        cursor: pointer;
        float: RIGHT;
        position: ABSOLUTE;
        margin-left: -60PX;
        height: 20px;
        font-size:12px;
        font-family: Arial;
        padding-left: 6px; 
        padding-right: 6px;
        border:1px solid #768ea5; 
        background-image: none;
        background-color: rgb(214,211,206);
    }