In order to set a percentage height, its parent element must have an explicit height. So the parent (container) of WebGrid, in this case is the div element, must have an explicit height property. That height can also be percentage, that just moves the problem up to the next level. This means the parent's parent (grand-parent) height must be defined too. This could go until the html root element.

So set the height of the html and the body element to 100%, as well as every single ancestor element of that element that you wish to have the 100% height in the first place.

Add following style tag into the page, Webcomboexpbasic.aspx:

<style type="text/css">
    html, body, form
    {
        height: 100%;
        width: 100%;
        padding: 0;
        margin: 0;
    }
</style>

Next, set the grid's parent height to specific height, for example 100%.

<div style="height: 100%;">
    <ISWebGrid:WebGrid ID="WebGrid1" runat="server"
        DefaultStyleMode="Elegant" UseDefaultStyle="True" 
        Height="50%" Width="98%" ...> 
        ...
    </ISWebGrid:WebGrid>
</div>

It's all set. The height issue no longer persist and the message "There are no rows in this view." appear in the correct position.

This should helps.

Glad to hear the good news.

Should you need further assistance or run into any problems regarding our controls, feel free to post it into our community site. We would be happy to assist you again.