Question

I’ve got a project that uses a Master Page.

There is also a Content Page that displays the summary of my data in a GridView control.

The basics of this content element are:

<table>
  <tr>
    <td>Search: <asp:DropDownList ID="ddlColum" runat="server"></asp:DropDownList></td>
    <td>Value: <asp:TextBox ID="txtValue" runat="server"></asp:TextBox></td>
    <td><asp:Button ID="btnSearch" runat="server" Text="Search"></asp:Button></td>
  </tr>
  <tr>
    <td colspan="3">
      <asp:GridView ID="summaryGrid" runat="server"></asp:GridView>
    </td>
  </tr>
</table>

I have tried adding CSS to the table, to the table row, to the table detail, to the asp:GridView and to the GridView control’s CssClass.

No matter what I do, as soon as the data is bound to the GridView control, the control will completely fill the <table>, hiding my search controls in the first row.

After reading up on numerous other related problems online, I thought it might be because my control does its databinding in the code behind. Therefore, I redesigned my ASP.NET page to bind in the HTML. The problem is still there, I just no longer get to initially see my search controls in the first row.

Does anyone familiar with what would cause something like this?

EDIT:

By popular request (1 person), here’s the link to the project: >> LINK << (All binary information has been removed)

Note, however, that the data binding features will not work on your end.

Answer 1

jp: I have reproduced your problem with a Master Page–>Content Page–>the same Table you have above and it does not create this problem. Please copy your CSS in.

Edit, offending lines in your CSS are:

div {
   left: 0px;
   position:absolute;
   top: 0px;
   width:100%;
   z-index:0;
}

So, you’re telling all Divs to be position absolutely at the top left.