Question

我已经使用Listview创建了一个Web表单页面。它在Chrome中正常运行，但它并不适用于Firefox。我确定它不是CSS故障。任何想法为什么会发生？

我的索引页面的代码：

<asp:ListView ID="ListView1" runat="server" DataSourceID="SqlDataSource1" GroupItemCount="2" DataKeyNames="ID" OnItemDataBound="ListView1_ItemDataBound">
        <AlternatingItemTemplate>
            <td runat="server" style="background-color: rgba(255, 255, 255, 0.75); width: 405px; height: 200px; text-align: left; vertical-align: top; padding: 10px 10px; display: inline-block; margin: 5px 0px 5px 5px;">
                <asp:HyperLink ID="HyperLink1" runat="server" NavigateUrl='<%# Eval("ID", "~/news.aspx?id={0}") %>' Text='<%# Eval("tytul", "{0}") %>'></asp:HyperLink>
                <br />
                <asp:Label ID="dataLabel" runat="server" Text='<%# Eval("data") %>' />
                <br />
                <br />
                <asp:Image ID="Image3" runat="server" ImageUrl='<%# Eval("image", "{0}") %>' Height="100px" Width="100px" Visible='<%# Eval("image")!=DBNull.Value %>' style="float:left; margin-left:0px; margin-right: 5px;"/>
                <asp:Label ID="trescLabel" runat="server" Text='<%# Eval("tresc") %>' CssClass="contenttext"/>
                <br />
            </td>
        </AlternatingItemTemplate>
        <EditItemTemplate>
            <td runat="server" style="">ID:
                <asp:Label ID="IDLabel1" runat="server" Text='<%# Eval("ID") %>' />
                <br />
                tytul:
                <asp:TextBox ID="tytulTextBox" runat="server" Text='<%# Bind("tytul") %>' />
                <br />tresc:
                <asp:TextBox ID="trescTextBox" runat="server" Text='<%# Bind("tresc") %>' />
                <br />data:
                <asp:TextBox ID="dataTextBox" runat="server" Text='<%# Bind("data") %>' />
                <br />image:
                <asp:TextBox ID="imageTextBox" runat="server" Text='<%# Bind("image") %>' />
                <br />
                <asp:Button ID="UpdateButton" runat="server" CommandName="Update" Text="Update" />
                <br />
                <asp:Button ID="CancelButton" runat="server" CommandName="Cancel" Text="Cancel" />
                <br /></td>
        </EditItemTemplate>
        <EmptyDataTemplate>
            <table runat="server" style="">
                <tr>
                    <td>No data was returned.</td>
                </tr>
            </table>
        </EmptyDataTemplate>
        <EmptyItemTemplate>
<td runat="server" />
        </EmptyItemTemplate>
        <GroupTemplate>
            <tr id="itemPlaceholderContainer" runat="server">
                <td id="itemPlaceholder" runat="server"></td>
            </tr>
        </GroupTemplate>
        <InsertItemTemplate>
            <td runat="server" style="">tytul:
                <asp:TextBox ID="tytulTextBox" runat="server" Text='<%# Bind("tytul") %>' />
                <br />tresc:
                <asp:TextBox ID="trescTextBox" runat="server" Text='<%# Bind("tresc") %>' />
                <br />data:
                <asp:TextBox ID="dataTextBox" runat="server" Text='<%# Bind("data") %>' />
                <br />image:
                <asp:TextBox ID="imageTextBox" runat="server" Text='<%# Bind("image") %>' />
                <br />
                <asp:Button ID="InsertButton" runat="server" CommandName="Insert" Text="Insert" />
                <br />
                <asp:Button ID="CancelButton" runat="server" CommandName="Cancel" Text="Clear" />
                <br /></td>
        </InsertItemTemplate>
        <ItemTemplate>
            <td runat="server" style="background-color: rgba(255, 255, 255, 0.75); width: 405px; height: 200px; text-align: left; vertical-align: top; padding: 10px 10px; display: inline-block; margin: 5px 5px 5px 5px;">
                <asp:HyperLink ID="HyperLink1" runat="server" NavigateUrl='<%# Eval("ID", "~/news.aspx?id={0}") %>' Text='<%# Eval("tytul", "{0}") %>'></asp:HyperLink>
                <br />
                <asp:Label ID="dataLabel" runat="server" Text='<%# Eval("data") %>'></asp:Label>
                <br />
                <br />
                <asp:Image ID="Image3" runat="server" ImageUrl='<%# Eval("image", "{0}") %>' Width="100px" Height="100px" Visible='<%# Eval("image")!=DBNull.Value %>' style="float:left; margin-left:0px; margin-right: 5px;"/>
                <asp:Label ID="trescLabel" runat="server" Text='<%# Eval("tresc") %>' CssClass="contenttext" />
                </td>
        </ItemTemplate>
        <LayoutTemplate>
            <table runat="server">
                <tr runat="server">
                    <td runat="server">
                        <table id="groupPlaceholderContainer" runat="server" border="0" style="">
                            <tr id="groupPlaceholder" runat="server">
                            </tr>
                        </table>
                    </td>
                </tr>
                <tr runat="server">
                    <td runat="server" style="background-color: rgba(255, 255, 255, 0.75); width: 860px; height: 25px; display: block; margin: 0px 8px 0px 8px; text-align: center; padding-top: 10px;">
                        <asp:DataPager ID="DataPager1" runat="server" PageSize="4">
                            <Fields>
                                <asp:NumericPagerField />
                            </Fields>
                        </asp:DataPager>
                    </td>
                </tr>
            </table>
        </LayoutTemplate>
        <SelectedItemTemplate>
            <td runat="server" style="">ID:
                <asp:Label ID="IDLabel" runat="server" Text='<%# Eval("ID") %>' />
                <br />tytul:
                <asp:Label ID="tytulLabel" runat="server" Text='<%# Eval("tytul") %>' />
                <br />tresc:
                <asp:Label ID="trescLabel" runat="server" Text='<%# Eval("tresc") %>' />
                <br />data:
                <asp:Label ID="dataLabel" runat="server" Text='<%# Eval("data") %>' />
                <br />image:
                <asp:Label ID="imageLabel" runat="server" Text='<%# Eval("image") %>' />
                <br />
            </td>
        </SelectedItemTemplate>
</asp:ListView>

在Chrome中查看（正确）：

在Firefox中查看：

Answer 1

Asp.Net服务器呈现的最终HTML，因此发送到任何浏览器都是一样的。

这里布局/显示的差异可能是因为不同浏览器解释相同HTML的方式。

在{{1}}中使用Table，知道Firefox会有一些奇怪的行为，尤其是Padding。

查看此帖子：Table Differences: Chrome vs Firefox

作为最后一点，请避免使用表格进行布局。除了降低可访问性和许多其他因素之外，它们对SEO目的不再好。请检查此Link。

Listview模板不适用于Firefox

1 个答案: