locked
remove a cell border from table RRS feed

  • Question

  • User693597704 posted

    I have a table created that depending on the number of rows needed, I am able to hide the rows not needed. I accomplished this by simmply assigning row names for example id="row1" ...... then in the program i simply put in row1.visible = false to hide the row....

    now i have some cells that have a right border on them that I simply need to remove, so what I did was the same I went into the HTML for the cell and assigned it a name, but I can not figure out How do I set the border style to none??

    here is what I have in HTML

    <tr id="row9" runat="server">
                    <td class="style129" align="right" style="border-right-style: solid">
                        <asp:Button ID="ReportRd1player5" runat="server" Text="Report Loss" 
                            Visible="False" />
                        <asp:TextBox ID="SingleRd1P5" runat="server" Width="187px" Visible="False">5</asp:TextBox>
                    </td>
                    <td class="style129" align="left">
                        <asp:Button ID="ReportRd2player3" runat="server" Text="Report Loss" 
                            Visible="False" />
                    </td>
                    <td class="style129" align="left" style="border-right-style: solid">
                        &nbsp;</td>
                    <td id = "Border8off" runat="server" class="style129" align="left" style="border-right-style: solid">
                        &nbsp;</td>
                    <td class="style129" >
                        &nbsp;</td>
                    <td class="style130">
                        &nbsp;</td>
                </tr>

    Now the section pertaining to the particular cell is

     <td id = "Border8off" runat="server" class="style129" align="left" style="border-right-style: solid">
                        &nbsp;</td>
    

    and what I tried within my program is
    Border8off.style="border-right-style: null" and Border8off.style= ""

     

    What is the way to do this?

     

     

    Monday, February 17, 2014 8:24 PM

All replies

  • User2103319870 posted

    Hi,

    To remove the border from table cell you need to set the css style to 'none' like given below

    <td id="Border8off" runat="server" class="style129" align="left" style="border-right-style: none">
                        &nbsp;
                    </td>

    Your Modified Code:

    <table>
                <tr id="row9" runat="server">
                    <td class="style129" align="right" style="border-right-style: solid">
                        <asp:Button ID="ReportRd1player5" runat="server" Text="Report Loss" Visible="False" />
                        <asp:TextBox ID="SingleRd1P5" runat="server" Width="187px" Visible="False">5</asp:TextBox>
                    </td>
                    <td class="style129" align="left">
                        <asp:Button ID="ReportRd2player3" runat="server" Text="Report Loss" Visible="False" />
                    </td>
                    <td class="style129" align="left" style="border-right-style: solid">
                        &nbsp;
                    </td>
                    <td id="Border8off" runat="server" class="style129" align="left" style="border-right-style: none">
                        &nbsp;
                    </td>
                    <td class="style129">
                        &nbsp;
                    </td>
                    <td class="style130">
                        &nbsp;
                    </td>
                </tr>
            </table>
    Monday, February 17, 2014 8:35 PM
  • User693597704 posted

    Thank you for your response, but I do not wish to permanently change it. Only programatically when that particular situation needs it off for a short period of time

    Monday, February 17, 2014 8:42 PM
  • User2103319870 posted

    Hi,

    You can try with the below implementation.

    First Add the below css style in your page

    <style type="text/css">
            .tableBorder
            {
                border-right-style: none !important;
            }
        </style>

    Then from code behind set the class to your td like given below

    if (YourCheckConditionhere)
                    {
                        //If condition is true then remove the right border from table row
                        Border8off.Attributes.Add("class", "tableBorder");
                    }

    Complete Aspx Code:

    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title></title>
        <style type="text/css">
            .tableBorder
            {
                border-right-style: none !important;
            }
        </style>
    </head>
    <body>
        <form id="form1" runat="server">
        <div>
            <table>
                <tr id="row9" runat="server">
                    <td class="style129" align="right" style="border-right-style: solid">
                        <asp:Button ID="ReportRd1player5" runat="server" Text="Report Loss" Visible="False" />
                        <asp:TextBox ID="SingleRd1P5" runat="server" Width="187px" Visible="False">5</asp:TextBox>
                    </td>
                    <td class="style129" align="left">
                        <asp:Button ID="ReportRd2player3" runat="server" Text="Report Loss" Visible="False" />
                    </td>
                    <td class="style129" align="left" style="border-right-style: solid">
                        &nbsp;
                    </td>
                    <td id="Border8off" runat="server" class="style129" align="left" >
                        &nbsp;
                    </td>
                    <td class="style129">
                        &nbsp;
                    </td>
                    <td class="style130">
                        &nbsp;
                    </td>
                </tr>
            </table>
        </div>
        </form>
    </body>
    </html>

    Monday, February 17, 2014 9:36 PM
  • User693597704 posted

    that did not do it   all it did was remove style="border-right-style: solid" from the cell properties so that when the table is loaded it is alread not there. I need this left in place. So I tried leaving it and added

    <style type="text/css">
            .tableBorder
            {
                border-right-style: none !important;
            }
        </style>
    

    then in code behind I inserted

     Border8off.Attributes.Add("class", "tableBorder")

    I removed the brackest and ; as I am doing this in visual basic not C

     

     

    Monday, February 17, 2014 10:33 PM
  • User1607087669 posted

    hey

    first remove inline css as inline css as hs highest priority then create an  extralnal css and use your code that will do the trick

    Tuesday, February 18, 2014 10:56 AM