无法使用css移动listView

Question

我正在尝试使用css移动列表视图...当我在布局模板中的div标签中给它一些值时，它向左移动。但是当我在浏览器中运行它时，我得到的是listView坐在同一个地方..这里是带有两个有问题的列表视图的代码：

<%@ Page Title="" Language="C#" MasterPageFile="~/CP.master" AutoEventWireup="true"
     CodeFile="Spam.aspx.cs" Inherits="Moderator_Spam" %>

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="Server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="Server">
     <br />
     <asp:Label ID="CommentHeader" runat="server" Text="הודעות ספאם של פוסטים"></asp:Label>
     <br />
     <br />
     <asp:ListView ID="ListView1" runat="server" DataKeyNames="CommentsID" DataSourceID="SqlDataSource1"
          Style="top: 433px; left: -56px">
          <AlternatingItemTemplate>
               <tr style="background-color: #FFF8DC;">
                    <td>
                         <asp:Label ID="CommentsLabel" runat="server" Text='<%# Eval("Comments") %>' />
                    </td>
                    <td>
                         <asp:Button ID="DeleteComment_Btn" runat="server" Text="מחק" CommandName="Delete" />
                         <asp:Button ID="IgnoreComment_Btn" runat="server" Text="התעלם" CommandName="Update" />
                    </td>
               </tr>
          </AlternatingItemTemplate>
          <EditItemTemplate>
               <tr style="background-color: #008A8C; color: #FFFFFF;">
                    <td>
                         <asp:Button ID="UpdateButton" runat="server" CommandName="Update" Text="Update" />
                         <asp:Button ID="CancelButton" runat="server" CommandName="Cancel" Text="Cancel" />
                    </td>
                    <td>
                         <asp:TextBox ID="CommentsTextBox" runat="server" Text='<%# Bind("Comments") %>' />
                    </td>
               </tr>
          </EditItemTemplate>
          <EmptyDataTemplate>
               <table id="Table1" runat="server" style="background-color: #FFFFFF; border-collapse: collapse;
                    border-color: #999999; border-style: none; border-width: 1px;">
                    <tr>
                         <td>
                              אין ספאם
                         </td>
                    </tr>
               </table>
          </EmptyDataTemplate>
          <InsertItemTemplate>
               <tr style="">
                    <td>
                         <asp:Button ID="InsertButton" runat="server" CommandName="Insert" Text="Insert" />
                         <asp:Button ID="CancelButton" runat="server" CommandName="Cancel" Text="Clear" />
                    </td>
                    <td>
                         <asp:TextBox ID="CommentsTextBox" runat="server" Text='<%# Bind("Comments") %>' />
                    </td>
                    <td>
                         &nbsp;
                    </td>
               </tr>
          </InsertItemTemplate>
          <ItemTemplate>
               <tr style="background-color: #DCDCDC; color: #000000;">
                    <td>
                         <asp:Label ID="CommentsLabel" runat="server" Text='<%# Eval("Comments") %>' />
                    </td>
                    <td>
                         <asp:Button ID="DeleteComment_Btn" runat="server" Text="מחק" CommandName="Delete" />
                         <asp:Button ID="IgnoreComment_Btn" runat="server" Text="התעלם" CommandName="Update" />
                    </td>
               </tr>
          </ItemTemplate>
          <LayoutTemplate>
               <div style="position: absolute; left: 0px">
                    <table id="Table2" runat="server">
                         <tr id="Tr1" runat="server">
                              <td id="Td1" runat="server">
                                   <table id="itemPlaceholderContainer" runat="server" border="1" style="background-color: #FFFFFF;
                                        border-collapse: collapse; border-color: #999999; border-style: none; border-width: 1px;
                                        font-family: Verdana, Arial, Helvetica, sans-serif;">
                                        <tr id="Tr2" runat="server" style="background-color: #DCDCDC; color: #000000;">
                                             <th id="Th1" runat="server">
                                                  Comments
                                             </th>
                                        </tr>
                                        <tr id="itemPlaceholder" runat="server">
                                        </tr>
                                   </table>
                              </td>
                         </tr>
                         <tr id="Tr3" runat="server">
                              <td id="Td2" runat="server" style="text-align: center; background-color: #CCCCCC;
                                   font-family: Verdana, Arial, Helvetica, sans-serif; color: #000000;">
                                   <asp:DataPager ID="DataPager1" runat="server">
                                        <Fields>
                                             <asp:NextPreviousPagerField ButtonType="Button" ShowFirstPageButton="True" ShowLastPageButton="True" />
                                        </Fields>
                                   </asp:DataPager>
                              </td>
                         </tr>
                    </table>
               </div>
          </LayoutTemplate>
          <SelectedItemTemplate>
               <tr style="background-color: #008A8C; font-weight: bold; color: #FFFFFF;">
                    <td>
                         <asp:Label ID="CommentsLabel" runat="server" Text='<%# Eval("Comments") %>' />
                    </td>
               </tr>
          </SelectedItemTemplate>
     </asp:ListView>
     <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:CP_AllQuestionsAnswered %>"
          DeleteCommand="ModeratorSpamDeleteComment" DeleteCommandType="StoredProcedure"
          SelectCommand="ModeratorSpamComments" SelectCommandType="StoredProcedure" UpdateCommand="ModeratorIgnoreSpamComment"
          UpdateCommandType="StoredProcedure">
          <DeleteParameters>
               <asp:Parameter Name="CommentsID" Type="Int32" />
          </DeleteParameters>
          <UpdateParameters>
               <asp:Parameter Name="CommentsID" Type="Int32" />
          </UpdateParameters>
     </asp:SqlDataSource>
     <br />
     <asp:Label ID="Label1" runat="server" Text="הודעות ספאם של אשכולים"></asp:Label>
     <br />
     <asp:ListView ID="ListView2" runat="server" DataKeyNames="ThreadsID" DataSourceID="SqlDataSource2"
          Style="z-index: 1; left: 452px; top: 753px; position: absolute; height: 381px;
          width: 221px">
          <AlternatingItemTemplate>
               <tr style="background-color: #FFF8DC;">
                    <td>
                         <asp:Label ID="ThreadTitleLabel" runat="server" Text='<%# Eval("ThreadTitle") %>' />
                    </td>
                    <td>
                         <asp:Button ID="DeleteThread_Btn" runat="server" Text="מחק" CommandName="Delete" />
                         <asp:Button ID="IgnoreThread_Btn" runat="server" Text="התעלם" CommandName="Update" />
                    </td>
               </tr>
          </AlternatingItemTemplate>
          <EditItemTemplate>
               <tr style="background-color: #008A8C; color: #FFFFFF;">
                    <td>
                         <asp:Button ID="UpdateButton" runat="server" CommandName="Update" Text="Update" />
                         <asp:Button ID="CancelButton" runat="server" CommandName="Cancel" Text="Cancel" />
                    </td>
                    <td>
                         <asp:TextBox ID="ThreadTitleTextBox" runat="server" Text='<%# Eval("ThreadTitle") %>' />
                    </td>
               </tr>
          </EditItemTemplate>
          <EmptyDataTemplate>
               <table id="Table3" runat="server" style="background-color: #FFFFFF; border-collapse: collapse;
                    border-color: #999999; border-style: none; border-width: 1px;">
                    <tr>
                         <td>
                              אין ספאם
                         </td>
                    </tr>
               </table>
          </EmptyDataTemplate>
          <InsertItemTemplate>
               <tr style="">
                    <td>
                         <asp:Button ID="InsertButton" runat="server" CommandName="Insert" Text="Insert" />
                         <asp:Button ID="CancelButton" runat="server" CommandName="Cancel" Text="Clear" />
                    </td>
                    <td>
                         <asp:TextBox ID="ThreadTitleTextBox" runat="server" Text='<%# Bind("ThreadTitle") %>' />
                    </td>
                    <td>
                         &nbsp;
                    </td>
               </tr>
          </InsertItemTemplate>
          <ItemTemplate>
               <tr style="background-color: #DCDCDC; color: #000000;">
                    <td>
                         <asp:Label ID="ThreadTitleLabel" runat="server" Text='<%# Eval("ThreadTitle") %>' />
                    </td>
                    <td>
                         <asp:Button ID="DeleteThread_Btn" runat="server" Text="מחק" CommandName="Delete" />
                         <asp:Button ID="IgnoreThread_Btn" runat="server" Text="התעלם" CommandName="Update" />
                    </td>
               </tr>
          </ItemTemplate>
          <LayoutTemplate>
               <table id="Table4" runat="server">
                    <tr id="Tr4" runat="server">
                         <td id="Td3" runat="server">
                              <table id="itemPlaceholderContainer" runat="server" border="1" style="background-color: #FFFFFF;
                                   border-collapse: collapse; border-color: #999999; border-style: none; border-width: 1px;
                                   font-family: Verdana, Arial, Helvetica, sans-serif;">
                                   <tr id="Tr5" runat="server" style="background-color: #DCDCDC; color: #000000;">
                                        <th id="Th2" runat="server">
                                             ThreadTitle
                                        </th>
                                   </tr>
                                   <tr id="itemPlaceholder" runat="server">
                                   </tr>
                              </table>
                         </td>
                    </tr>
                    <tr id="Tr6" runat="server">
                         <td id="Td4" runat="server" style="text-align: center; background-color: #CCCCCC;
                              font-family: Verdana, Arial, Helvetica, sans-serif; color: #000000;">
                              <asp:DataPager ID="DataPager1" runat="server">
                                   <Fields>
                                        <asp:NextPreviousPagerField ButtonType="Button" ShowFirstPageButton="True" ShowLastPageButton="True" />
                                   </Fields>
                              </asp:DataPager>
                         </td>
                    </tr>
               </table>
          </LayoutTemplate>
          <SelectedItemTemplate>
               <tr style="background-color: #008A8C; font-weight: bold; color: #FFFFFF;">
                    <td>
                         <asp:Label ID="ThreadTitleLabel" runat="server" Text='<%# Eval("ThreadTitle") %>' />
                    </td>
               </tr>
          </SelectedItemTemplate>
     </asp:ListView>
     <asp:SqlDataSource ID="SqlDataSource2" runat="server" ConnectionString="<%$ ConnectionStrings:CP_AllQuestionsAnswered %>"
          DeleteCommand="ModeratorSpamDeleteThread" DeleteCommandType="StoredProcedure"
          SelectCommand="ModeratorSpamThread" SelectCommandType="StoredProcedure" UpdateCommand="ModeratorSpamIgnoreThread"
          UpdateCommandType="StoredProcedure">
          <DeleteParameters>
               <asp:Parameter Name="ThreadsID" Type="Int32" />
          </DeleteParameters>
          <UpdateParameters>
               <asp:Parameter Name="ThreadsID" Type="Int32" />
          </UpdateParameters>
     </asp:SqlDataSource>
</asp:Content>

Answer 1

我认为您的错误是您尝试直接在ListView控件上设置Style。 listView控件没有Style属性。实际上可以应用这种风格的元素。将样式从ListViews移动到LayoutTemplate中的第一个表。

Answer 2

将列表视图放在div中并给它留一个边距      

 <asp:ListView ID="ListView1" runat="server" DataKeyNames="CommentsID" DataSourceID="SqlDataSource1"
          Style="top: 433px; left: -56px">
          <AlternatingItemTemplate>
               <tr style="background-color: #FFF8DC;">
                    <td>
                         <asp:Label ID="CommentsLabel" runat="server" Text='<%# Eval("Comments") %>' />
                    </td>
                    <td>
                         <asp:Button ID="DeleteComment_Btn" runat="server" Text="מחק" CommandName="Delete" />
                         <asp:Button ID="IgnoreComment_Btn" runat="server" Text="התעלם" CommandName="Update" />
                    </td>
               </tr>
          </AlternatingItemTemplate>
          <EditItemTemplate>
               <tr style="background-color: #008A8C; color: #FFFFFF;">
                    <td>
                         <asp:Button ID="UpdateButton" runat="server" CommandName="Update" Text="Update" />
                         <asp:Button ID="CancelButton" runat="server" CommandName="Cancel" Text="Cancel" />
                    </td>
                    <td>
                         <asp:TextBox ID="CommentsTextBox" runat="server" Text='<%# Bind("Comments") %>' />
                    </td>
               </tr>
          </EditItemTemplate>
          <EmptyDataTemplate>
               <table id="Table1" runat="server" style="background-color: #FFFFFF; border-collapse: collapse;
                    border-color: #999999; border-style: none; border-width: 1px;">
                    <tr>
                         <td>
                              אין ספאם
                         </td>
                    </tr>
               </table>
          </EmptyDataTemplate>
          <InsertItemTemplate>
               <tr style="">
                    <td>
                         <asp:Button ID="InsertButton" runat="server" CommandName="Insert" Text="Insert" />
                         <asp:Button ID="CancelButton" runat="server" CommandName="Cancel" Text="Clear" />
                    </td>
                    <td>
                         <asp:TextBox ID="CommentsTextBox" runat="server" Text='<%# Bind("Comments") %>' />
                    </td>
                    <td>
                         &nbsp;
                    </td>
               </tr>
          </InsertItemTemplate>
          <ItemTemplate>
               <tr style="background-color: #DCDCDC; color: #000000;">
                    <td>
                         <asp:Label ID="CommentsLabel" runat="server" Text='<%# Eval("Comments") %>' />
                    </td>
                    <td>
                         <asp:Button ID="DeleteComment_Btn" runat="server" Text="מחק" CommandName="Delete" />
                         <asp:Button ID="IgnoreComment_Btn" runat="server" Text="התעלם" CommandName="Update" />
                    </td>
               </tr>
          </ItemTemplate>
          <LayoutTemplate>
               <div style="position: absolute; left: 0px">
                    <table id="Table2" runat="server">
                         <tr id="Tr1" runat="server">
                              <td id="Td1" runat="server">
                                   <table id="itemPlaceholderContainer" runat="server" border="1" style="background-color: #FFFFFF;
                                        border-collapse: collapse; border-color: #999999; border-style: none; border-width: 1px;
                                        font-family: Verdana, Arial, Helvetica, sans-serif;">
                                        <tr id="Tr2" runat="server" style="background-color: #DCDCDC; color: #000000;">
                                             <th id="Th1" runat="server">
                                                  Comments
                                             </th>
                                        </tr>
                                        <tr id="itemPlaceholder" runat="server">
                                        </tr>
                                   </table>
                              </td>
                         </tr>
                         <tr id="Tr3" runat="server">
                              <td id="Td2" runat="server" style="text-align: center; background-color: #CCCCCC;
                                   font-family: Verdana, Arial, Helvetica, sans-serif; color: #000000;">
                                   <asp:DataPager ID="DataPager1" runat="server">
                                        <Fields>
                                             <asp:NextPreviousPagerField ButtonType="Button" ShowFirstPageButton="True" ShowLastPageButton="True" />
                                        </Fields>
                                   </asp:DataPager>
                              </td>
                         </tr>
                    </table>
               </div>
          </LayoutTemplate>
          <SelectedItemTemplate>
               <tr style="background-color: #008A8C; font-weight: bold; color: #FFFFFF;">
                    <td>
                         <asp:Label ID="CommentsLabel" runat="server" Text='<%# Eval("Comments") %>' />
                    </td>
               </tr>
          </SelectedItemTemplate>
     </asp:ListView>
</div>