Simple Gridview and button problems

Question

In the following code:

1. I need to use break in between Disable Location (Title) and the gridview

2. I want the border color of grid to none. I do not want any color.

3. I want both the buttons Disable or deactivate and Cancel to be displayed just below the gridview. and in the middle of the page.

    <div style="display: block; background: url(images/reusable_blue_bg.jpg) repeat-x 0 -15px;
        border-left: #88b9c7 1px solid; border-bottom: #88b9c7 1px solid; border-top: #88b9c7 1px solid;
        border-right: #88b9c7 1px solid; padding: 0px 2px; height: 236px; min-height: 236px;
        height: auto; margin-left: auto; margin-right: auto;">
        <table align="center" style="width: 554px; border-top-style: none; border-right-style: none;
            border-left-style: none; border-bottom-style: none" id="TABLE1">
   
            <tr>
                <td align="center" colspan="5" style="font-weight: normal; font-size: 20px; margin: 0px;
                    font-family: Arial; color: #1e7c9b;">
                    Disable Location</td>
            </tr>
   

I need number 1 over here..

            <asp:GridView ID="disableloc" runat="server" AutoGenerateColumns="False" DataKeyNames="LocationName"
                DataSourceID="" AllowPaging="True" EnableViewState="true" BorderStyle="None">

I want 2 over here, I guess

            </asp:GridView>
                    

I want 3 in here..

            <tr align ="center" style="position:fixed">
               <asp:ImageButton ID="btnDisable" runat="server" ImageAlign="Middle" ImageUrl="~/images/green-deactivate.gif" OnClick="btnDisable_Click"
                    ValidationGroup="group1" />
                      
               <asp:ImageButton ID="btnCancel" runat="server" ImageUrl="~/images/cancel.gif" OnClick="btnCancel_Click" />
       
            </tr>
         </table>

    </div>

Answer 1

For #1, try using margin or padding on the td, or wrap "Disable Location" in a span (or something) and style its margin/padding to give some space.

For #2, try setting Gridlines="None" on the GridView.

For #3, make sure you have a <td> inside the <tr>, and try using text-align:center on either the td or a div wrapping the buttons. Alternatively, don't put it in the table, just wrap them in a div with text-align:center, right under the table (do you need the table at all?)

Answer 2

This is rather basic HTML/CSS knowledge (nothing wrong with that), but investigating basic information sources may help you help yourself.

As to your specific items:

• A 'break' can be as simple as a <br /> statement between the controls
• if you don't want colors: #88b9c7 and similar-looking statements are colors.
• As you're using a table, positioning the buttons below your grid can be done by placing them in the correct <tr> / <td>

Answer 3

1. Use padding-bottom in the header td style to get the proper spacing.
2. Use gridlines="None" on the GridView.
3. Put the Gridview and the buttons in td:s to place them properly.