Abdu
Abdu

Reputation: 205

How can I display contents in the top of a table cell?

I have a contentpage which has a gridview to display the details. In masterpage I have placed the contentplaceHolder in a table cell. I just want to display the gridview adjacent to the top of the cell. Gridview always displayed in middle.

Here is my code (master page):

<asp:Panel ID="Panel3" runat="server" BackColor="white" Width="100%"> 

        <table width="100%" style="text-align:center;">
            <tr>
                <td style="width: 90%">
                    <table width="100%">
                        <tr >
                            <td style="width: 20%;text-align:center;background-color:#eeeeee">
                                <div id="nav" class="menu">
                                                <ul>
                                                    <li id="Li1" class="liALL" runat="server"><a href="BusinessOpportunity.aspx"><font face="calibri">BusinessOpportunity
                                                    </font></a></li>
                                                    <li id="Li2" class="liALL"  runat="server"><a href="OrderManagement.aspx"><font face="calibri">Oerdermanagement
                                                    </font></a></li>
                                                    <li id="Li3" class="liALL" runat="server"><a href="FDtracking.aspx"><font face="calibri">Fdtracking </font>
                                                    </a></li>
                                                    <li id="Li4" class="liALL" runat="server"><a href="PBG.aspx"><font face="calibri">PBG
                                                    </font></a></li>
                                                    <li id="Li5" class="liALL" runat="server"><a href="AddressMaster.aspx"><font face="calibri">AdressMaster
                                                    </font></a></li>
                                                </ul>
                                            </div>
                            </td>
                            <td style="background-color:#fafafa;width:78%;padding:0px">
                               <div style="width:780px;margin-top:0px"> 
                                <asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
                                </asp:ContentPlaceHolder>
                                </div>
                            </td>
                        </tr>
                    </table>
                </td>
            </tr>
        </table>
    </asp:Panel>

Code (content page):

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

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="Server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="Server">
    <div class="bop" style="overflow: scroll">
        <table>
            <tr>
                <td>
                    <asp:GridView ID="GridView1" runat="server">
                        <RowStyle BackColor="#ffffff" ForeColor="#000000" Font-Size="12px" Height="10px" />
                        <HeaderStyle BackColor="#eeeeee" ForeColor="#183DAC" Font-Size="15px" Height="30px" />
                        <AlternatingRowStyle BackColor="#c0c0c0" ForeColor="#000000" Font-Size="12px" Height="10px" />
                    </asp:GridView>
                </td>
            </tr>
        </table>
    </div>
</asp:Content>

Upvotes: 1

Views: 908

Answers (1)

Denys Wessels
Denys Wessels

Reputation: 17049

vertical-align:top;

Just add this style to the table cell which hosts the GridView(on your master):

<td style="background-color: #fafafa; width: 78%; padding: 0px; vertical-align: top;">
    <div style="width: 780px; margin-top: 0px">
        <asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
        </asp:ContentPlaceHolder>
    </div>
</td>

Upvotes: 1

Related Questions