How to set fixed width and height for grid row which is dynamically generating in asp.net

Question

I have one asp.net grid view. This rows and columns are dynamically generating based on the retrieved values from database. In .aspx page i use grid <asp:GridView Height="250" Width="100%" runat="server" />

If I have the more number of rows then The grid is appearing like below.

If I have only one row grid is appearing like below.

But I want to show the grid rows height same as first image even if there is single row. How to set the grid row height values as fixed. I found some similar questions like this in stackoverflow. But those didn't give me the solution.

Answer 1

You can use GridView.RowStyle Property for defining the row style

GridView.RowStyle Property: Gets a reference to the TableItemStyle object that enables you to set the appearance of the data rows in a GridView control.

Eg.

<asp:GridView ID="GridView1">
        <rowstyle Height="20px" />
        <alternatingrowstyle  Height="20px"/>
</asp:GridView>

Answer 2

CSS : /grid/

.MoGrid { width: 100%; background-color: #fff; margin: 5px 0 10px 0;}

.MoGrid td { color: #F05117;font-family: georgia;font-weight: bold;padding: 30px 2px 2px;}

.MoGrid th {border-bottom: 1px solid #F05117;border-top: 1px solid #F05117;color: #29B6EA;
    font-size: 13px;font-weight: bold;padding: 4px 2px;font-family: georgia;}

.MoGrid .alt { background: #fcfcfc url(../Styles/images/grd_alt.png) repeat-x top; }

.MoGrid .pgrM {background: #29B6EA; height:10px; }

.MoGrid .pgrM table { margin: 5px 0; }

.MoGrid .pgrM td { border-width: 0; padding: 0 6px; border-left: solid 1px #666; font-weight: bold; color: #fff; line-height: 12px; float:left; }  

.MoGrid .pgrM a { color: #666; text-decoration: none; }

.MoGrid .pgrM a:hover { font-family: tahoma;font-size: 12px;background-color: #99BBE1; }

SOURCE :

<asp:GridView ID="GridView2" runat="server" CssClass="MoGrid"       
PagerStyle-CssClass="pgrM" AlternatingRowStyle-CssClass="alt">