MINIMIZING THE HEIGHT OF HEADER COLUMN

16 posts, 1 answers
  1. Ajay
    Ajay avatar
    66 posts
    Member since:
    May 2009

    Posted 28 May 2009 Link to this post

    Hi folks !!

    Can u guys please help me to sort me out of the below mentioned problem ??

    Actually, Iam using RAD GRID in my project. The header column of the grid is bit broader then it actually seems to be. My problem is that i want the header column of the RAD GRID to be shorten up or actually as that shown in your demo grid at the below mentioned link :-
       

    http://demos.telerik.com/aspnet-ajax/grid/examples/client/resizing/defaultcs.aspx

    I want my RAD GRID to show exactly it looks as yours.

    My second issue is that, I want RAD GRID to occupy all the space/width for the COLUMN HEADER.

    If we look carefully on to the DEMO GRID there is some space on the left size of the first column. I want it not to be shown as its been in demo.


    If u please help me , it would be my pleasure.



    Thanks.

  2. Answer
    Shinu
    Shinu avatar
    17764 posts
    Member since:
    Mar 2007

    Posted 28 May 2009 Link to this post

    Hi Ajay,

    I hope you are trying to set the height of the Grid header row. If so you may set the height for the HeaderStyle as shown below.

    ASPX:
     
     <HeaderStyle  Height="20px" /> 

    The extra column on the left side of the Grid may be the RowIndicator column. This column appears when you set the AllowRowResize property of the Grid. Try the following line of code to hide the RowIndicator column.

    CS:
     
    RadGrid1.MasterTableView.GetColumn("RowIndicator").Display = false


    Regards
    Shinu.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Ajay
    Ajay avatar
    66 posts
    Member since:
    May 2009

    Posted 29 May 2009 Link to this post

    Hi Shinu !!!

    Thanks a lot for all your suggestion .

    I applied all your feedbacks.  It really works..... Iam so glad that I cant stop praising u guys.... U really rocks....!!!

    But Shinu ,

    I was not able  to shorten up the HEIGHT of the HEADER COLUMN. It stays as it was earlier.

    Please help me to sort out this problem. I have applied the CODE given by you guys but height stays as it was before applying the code.

    Please help. 

  5. Princy
    Princy avatar
    17421 posts
    Member since:
    Mar 2007

    Posted 29 May 2009 Link to this post

    Hello Ajay,

    I tried setting the height of the grid header as  Shinu suggested and it works as expected. But the height of the grid header will not reduce beyond a certain limit. I'm not sure, how the grid header appears in your case so it would be better if you could send a screen shot of your grid
    http://www.picamatic.com/

    Thanks
    Princy.
  6. Ajay
    Ajay avatar
    66 posts
    Member since:
    May 2009

    Posted 29 May 2009 Link to this post

    Hi Princy !!

    I have uploaded my SCREENSHOT along with your DEMO GRID.
    I want the exact height of HEADER COLUMN as shown in in ur DEMO GRID.

    http://www.picamatic.com/?link=f5b2bb0d2fa2455430c854ed6b1a6fc4

    I have applied the following code in my GRID :-<HeaderStyle Height="20px">

    Its not working for me.

    Please solve it.

  7. Shinu
    Shinu avatar
    17764 posts
    Member since:
    Mar 2007

    Posted 01 Jun 2009 Link to this post

    Hi Ajay,

    Try setting the Height for the Grid header using the CSS style as shown below and see whether it is working fine.

    Style.Css:
     
    <head runat="server"
        <title>Untitled Page</title> 
      <style type="text/css"
             
             
            .RadGrid_[SkinName] .rgHeaderDiv 
             { 
                height:20px !important; 
             } 
         </style> 
          
       
    </head> 


    Regards
    Shinu
  8. Ajay
    Ajay avatar
    66 posts
    Member since:
    May 2009

    Posted 01 Jun 2009 Link to this post

    Hi shinu !!

    Thanks for your quick response.

    Shinu,

    I have applied your code snippet on to my demo apps, its still not working .

    Infact , I have tried to increase & decrease the HEIGHT of the header column ,but its not working.

    I have written ur given code on to CSS as well as on to the ASPX(html) page, its really not working.

    I dont know wats d problem n where is the problem ??

    Please help me .

    Its getting me frustrated.

    Help Shinu !!!

  9. Shinu
    Shinu avatar
    17764 posts
    Member since:
    Mar 2007

    Posted 01 Jun 2009 Link to this post

    Hi Ajay,

    What is the Skin that you are using for the Grid? Also which version of the grid are you using?

    Shinu
  10. Ajay
    Ajay avatar
    66 posts
    Member since:
    May 2009

    Posted 01 Jun 2009 Link to this post

    Hi shinu !


    SKIN : Gray

    VERSION :- 2008
  11. Shinu
    Shinu avatar
    17764 posts
    Member since:
    Mar 2007

    Posted 01 Jun 2009 Link to this post

    Hi Ajay,

    Are you using RadControls for asp.net or RadControls for asp.net ajax version. I can find the Gray skin only in  RadGrid for asp.net version.

    Shinu.
  12. Ajay
    Ajay avatar
    66 posts
    Member since:
    May 2009

    Posted 01 Jun 2009 Link to this post

    Hi shinu !!

    Shinu , Im using ASP.NET AJAX UI Controls that is mentioned in your product list.

    Im sure that skin named is GRAY.

    Shinu , Please help me sort out this problem.
  13. Dimo
    Admin
    Dimo avatar
    8333 posts

    Posted 01 Jun 2009 Link to this post

    Hello Ajay,

    In order to reduce the header row height, you need to reduce the header cells' vertical padding:

    /* RadGrid Q3 2008 or earlier */
    div.RadGrid_Gray  .GridHeader_Gray,
    div.RadGrid_Gray  .ResizeHeader_Gray
    {
            padding-top: 0;
            padding-bottom: 0;
    }


    /* RadGrid Q1 2009 or later */
    div.RadGrid_Gray  .rgHeader,
    div.RadGrid_Gray   th.rgResizeCol
    {
            padding-top: 0;
            padding-bottom: 0;
    }



    Best wishes,
    Dimo
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Check out the tips for optimizing your support resource searches.
  14. Ajay
    Ajay avatar
    66 posts
    Member since:
    May 2009

    Posted 01 Jun 2009 Link to this post

    Hi Dimo !

    Thanks a lot !!

     It really works !!

    Great work....

    You solved my problem.

    Keep doing excellent work !!!!
  15. Augusto Cosatti
    Augusto Cosatti avatar
    32 posts
    Member since:
    Jul 2009

    Posted 03 Nov 2009 Link to this post

    Hello.

    I'm trying to change the font size of the grid headers. I have added this to the CSS file:

    div.RadGrid_Office2007 .rgHeader  
    {    
        font-size16px !important;  
        font-weightbold !important;  
    The text is displayed in bold but the font size is not modified. I can put any value for the size, it does not change.

    Can you help me please ?

    Thanks
    Rgds
    Augusto  
  16. Dimo
    Admin
    Dimo avatar
    8333 posts

    Posted 03 Nov 2009 Link to this post

    Hello Augusto,

    Your CSS rule should work. I tried it on a standalone web page and the header font size increased. Please make sure that you are not specifying a font-size style for an inner element inside the header cells (e.g. the hyperlinks).

    Alternatively, you can try:

    div.RadGrid_Office2007 .rgHeader,
    div.RadGrid_Office2007 .rgHeader a

    {    
        font-size: 16px !important;  
        font-weight: bold !important;  
    }


    Generally, such issues are easily resolved with tools such as Firebug.

    If you still have problems with the font size, please send us a simple demo, so that we can inspect it locally and see what's wrong. A live URL will also do the job.


    All the best,
    Dimo
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
  17. Augusto Cosatti
    Augusto Cosatti avatar
    32 posts
    Member since:
    Jul 2009

    Posted 04 Nov 2009 Link to this post

    Hi Dimo.

    Adding the "a" attribute makes the font being increased. Indeed I'm using an hyperlink (a) attribute definition.

     

    Thanks for you help

    Regards

    Augusto

     

Back to Top
UI for ASP.NET Ajax is Ready for VS 2017