Styling Listview in asp.net

Question

I have got a listview which is styled with css but dosent work.Am I missing something here.

<asp:ListView ID="msg_list" runat="server">
   <ItemTemplate>
     <tr class="myitem">
        <td> <asp:Label role="menuitem" ID="msg_lbl" runat="server" text='<%#Eval("msg")%>' /> </td>
     </tr>
     <%--<hr style=" margin-top:1px; margin-bottom:1px; " />--%>
   </ItemTemplate>
  </asp:ListView>

Here is the css

.myitem  
    {  
       background-color:Red;    
    }

your code should work. May be your style got overwritten with default style. Did you try with `!important`? — Suresh Ponnukalai, Aug 05 '14 at 11:01
No I hadn't but i just did and still its not working.Actually its inside a dropdown of bootstrap..does that affect. — user35, Aug 05 '14 at 11:12

Richa · Accepted Answer · 2014-08-05T11:20:59.690

2

Table rows (tr) can't be styled as other elements (e.g. table cells (td)), meaning they don't react on every kind of styling. Why don't you just write:

Fiddle

<asp:ListView ID="msg_list" runat="server">
    <ItemTemplate>
        <table>
            <tr class="myitem">
                <td>
                    <asp:Label role="menuitem" ID="msg_lbl" runat="server" text='<%#Eval("msg")%>' />
                </td>
            </tr>
        </table>
        <%--<hr style=" margin-top:1px; margin-bottom:1px; " />--%></ItemTemplate>
</asp:ListView>



tr.myitem td{
    width:200px;
    height:20px;
    border:2px solid;
    background:red;
}

OR

Fiddle

<asp:ListView ID="msg_list" runat="server">
<ItemTemplate>
    <table>
        <tr class="myitem">
            <td>
                <asp:Label role="menuitem" ID="msg_lbl" runat="server" text='<%#Eval("msg")%>' />
            </td>
        </tr>
    </table>
    <%--<hr style=" margin-top:1px; margin-bottom:1px; " />--%></ItemTemplate>

.myitem {
    background:red;
}

EDIT

You need to add <table> tag

edited Aug 05 '14 at 11:20

answered Aug 05 '14 at 11:15

Richa

3,261
2
27
51

Won't that create a table in every row if the ListView? – Martin Smellworse Aug 05 '14 at 11:54
Richa the background is working but margin isn't `margin-left:30px !important;` – user35 Aug 05 '14 at 11:57
@user35 margin specifications are ignored for table cells Refer: http://www.w3.org/TR/CSS2/tables.html – Richa Aug 05 '14 at 12:03
Check this for more help http://stackoverflow.com/questions/4397142/cannot-put-margin-on-td-tag-with-neither-css-nor-cellspacing-attribute – Richa Aug 05 '14 at 12:05

Styling Listview in asp.net

1 Answers1