Question

我创建了一个div（搜索结果术语栏），只有当用户输入搜索词并且它应该出现在布局的中心时才会显示。

我使用了下面的CSS样式

search_list{ margin:0 auto; width:1000px; }

所以我在所有决议中都显示出中心。

现在我实现了一个asp.net面板ajax控件，只在用户输入搜索词时显示div。

以下是我的代码：

<asp:Panel runat="server" ID="pnlsearchinfo">
                            <div class="search_list" id="SearchText" visible="false" runat="server">
    <%--<div class="search_text">Search Result for </div>--%>

    <div class="search_term">
        <asp:Label ID="lblsearchtxt" runat="server" Text=""></asp:Label></div>
    <div class="search_return">
        <asp:ImageButton ID="IbtnSearchClose" ImageUrl="images/blu-close.jpg" runat="server"  align="absmiddle" OnClick="IbtnSearchClose_Click"  /><asp:LinkButton
            ID="lnkSearchClose" runat="server" OnClick="lnkSearchClose_Click" >Return to Full List</asp:LinkButton></div>                
    <br class="clr_flt" />
   </div><!-- end search_list --></asp:Panel>
   <cc1:AlwaysVisibleControlExtender TargetControlID="pnlsearchinfo" ScrollEffectDuration="1"
                    ID="AlwaysVisibleControlExtender1" VerticalOffset="225"  runat="server" Enabled="true">
                </cc1:AlwaysVisibleControlExtender>

但问题是保证金：0自动;在IE中正常工作（搜索结果术语栏居中）。但是在Firefox中它的抛出问题（向左对齐）

当我使用Horizonaloffset在firefox中工作时。但它不是解决方案友好的。我可以将搜索结果术语栏与其他一些控件对齐吗？

Answer 1

我猜测在Firefox中，＆lt; asp：Panel＆gt;创建的HTML未设置为100％宽度。尝试使用FireBug进行检查并查看。

如果是这种情况，有两种解决方案：

使用CSS将Panel的宽度设置为100％。除了你已经拥有的CSS，这将允许＆lt; div＆gt;以此为中心。
移动您现在拥有的CSS（margin：0 auto; width：1000px;）来控制Panel本身。由于面板看起来位于页面流的外部，因此它将在视口中水平居中。

Answer 2

您是否尝试过使用<div align="center">？是的，我知道标签已被弃用，但它仍然受到浏览器的广泛支持，甚至可能超过CSS等价物，谁知道呢？

Answer 3

尝试

<div id="SearchText" style="text-align:center;"><div style="width:1000px;">SEARCH RESULT FOR x</div></div>

Answer 4

在面板上放置一个css类（通过面板CssClsss属性）。

此css类必须指定宽度;

然后将你的div设置为margin：0 auto，这个div将在面板中居中

Answer 5

感谢所有

我使用固定搜索栏和css使用以下来源。

Click here

如何在asp.net中将包含面板的div居中？

5 个答案: