What's New?

[CLOSED] grid row height

  1. #1
    Nov 20, 2013, 7:46 AM

    [CLOSED] grid row height

    Hello is ther a way to manage row height into a grid?

    I ask that because something has changed between 2.2 and 2.3 version and now in 2.3 row height is a little greater than before a few pixels but it is sufficient for I have a bad comment from users, so I want to reduce that height to render my grids as in version 2.2.

    Here what I try in CSS :

    .x-grid-custom .x-grid-row TD {            
    font : 12px/16px arial,sans-serif;
    height     : 30px !important;
}
    I try to put it to 30 to see if something change but nothing. I try different values for same results.

    I use no padding or border value in grid or column definition. I think it is something related to CSS because I try "Simple Array Grid - Ext.NET Examples" and change the ext version to apply and row height are the same
    Last edited by Daniil; Nov 21, 2013 at 11:34 AM. Reason: [CLOSED]
  2. #2
    Nov 20, 2013, 11:49 AM
    Hi @feanor91,

    Please try this:
    .x-grid-custom .x-grid-cell-inner {
    line-height: 30px;
}
    13px by default.
  3. #3
    Nov 20, 2013, 2:23 PM
    It works.

    Do you know what is the default value?

    EDIT:
    I talk to quickly...It works to make row height greater but not smaller, I think the minimum height must be computed on something based on police size or something like that
    Last edited by feanor91; Nov 20, 2013 at 2:26 PM.
  4. #4
    Nov 20, 2013, 9:29 PM
    Hello!

    Quote Originally Posted by feanor91 View Post
    It works.

    Do you know what is the default value?

    EDIT:
    I talk to quickly...It works to make row height greater but not smaller, I think the minimum height must be computed on something based on police size or something like that
    The default value is 13px. About make it smaller, I tried with the following sample and it works:

    <%@ Page Language="C#" %>

<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>

<script runat="server">
    protected void Page_Load(object sender, EventArgs e)
    {
        if (!X.IsAjaxRequest)
        {
            this.Store1.DataSource = this.Data;
            this.Store1.DataBind();
        }
    }

    private object[] Data
    {
        get
        {
            return new object[]
            {
                new object[] { "3m Co", 71.72, 0.02, 0.03, "9/1 12:00am" },
                new object[] { "Alcoa Inc", 29.01, 0.42, 1.47, "9/1 12:00am" },
                new object[] { "Altria Group Inc", 83.81, 0.28, 0.34, "9/1 12:00am" },
                new object[] { "American Express Company", 52.55, 0.01, 0.02, "9/1 12:00am" },
                new object[] { "American International Group, Inc.", 64.13, 0.31, 0.49, "9/1 12:00am" },
                new object[] { "AT&T Inc.", 31.61, -0.48, -1.54, "9/1 12:00am" },
                new object[] { "Boeing Co.", 75.43, 0.53, 0.71, "9/1 12:00am" }
            };
        }
    }
</script>

<!DOCTYPE html>

<html>
<head runat="server">
    <style>
        .x-grid-custom .x-grid-cell-inner {
            line-height: 10px;
        }
    </style>
</head>
<body>
    <ext:ResourceManager runat="server" />
    
    <h1>Simple Array Grid</h1>
    
    <ext:GridPanel 
        ID="GridPanel1"
        runat="server" 
        Title="Array Grid" 
        Width="600" 
        Cls="x-grid-custom"
        Height="350">
        <Store>
            <ext:Store ID="Store1" runat="server" SortOnLoad="true">
                <Model>
                    <ext:Model runat="server">
                        <Fields>
                            <ext:ModelField Name="company" />
                            <ext:ModelField Name="price" Type="Float" />
                            <ext:ModelField Name="change" Type="Float" />
                            <ext:ModelField Name="pctChange" Type="Float" />
                            <ext:ModelField Name="lastChange" Type="Date" DateFormat="M/d hh:mmtt" />
                        </Fields>
                    </ext:Model>
                </Model>
                <Sorters>
                    <ext:DataSorter Direction="DESC" Property="company" />
                </Sorters>
            </ext:Store>
        </Store>
        <ColumnModel>
            <Columns>
                <ext:Column runat="server" Text="Company" DataIndex="company" Flex="1" />
                <ext:Column runat="server" Text="Price" DataIndex="price">                  
                </ext:Column>
                <ext:Column runat="server" Text="Change" DataIndex="change">
                </ext:Column>
                <ext:Column runat="server" Text="Change" DataIndex="pctChange">
                </ext:Column>
                <ext:DateColumn runat="server" Text="Last Updated" DataIndex="lastChange" />
            </Columns>            
        </ColumnModel>       
    </ext:GridPanel>
</body>
</html>
  5. #5
    Nov 21, 2013, 11:16 AM
    I manage to have line height modification, in fact I have some conflicted values in my css file like that:
    .x-grid-custom .x-grid-row TD {            
    font : 12px/16px arial,sans-serif;
}
    changing the "16px" help a lot :)

Similar Threads

  1. [CLOSED] Grid with grouping problem and the row height
    By ermanni.info in forum 2.x Legacy Premium Help
    Replies: 2
    Last Post: Sep 06, 2013, 11:49 AM
  2. [OPEN] [#283] Grid cell editor height
    By jchau in forum 2.x Legacy Premium Help
    Replies: 6
    Last Post: Jun 21, 2013, 6:11 AM
  3. [CLOSED] panel height auto adjust height according to the loaded page'height
    By hujq in forum 2.x Legacy Premium Help
    Replies: 2
    Last Post: Apr 15, 2013, 7:46 AM
  4. [CLOSED] textarea height in a grid roweditor
    By feanor91 in forum 2.x Legacy Premium Help
    Replies: 3
    Last Post: Aug 20, 2012, 1:17 PM
  5. [CLOSED] Dynamic Grid Height
    By adelaney in forum 2.x Legacy Premium Help
    Replies: 1
    Last Post: Aug 14, 2012, 7:34 PM

Posting Permissions