This is a migrated thread and some comments may be shown as answers.

MINIMIZING THE HEIGHT OF HEADER COLUMN

15 Answers 342 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Ajay
Top achievements
Rank 2
Ajay asked on 28 May 2009, 12:58 PM
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.

15 Answers, 1 is accepted

Sort by
0
Accepted
Shinu
Top achievements
Rank 2
answered on 29 May 2009, 04:32 AM
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.
0
Ajay
Top achievements
Rank 2
answered on 29 May 2009, 07:24 AM
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. 

0
Princy
Top achievements
Rank 2
answered on 29 May 2009, 08:06 AM
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.
0
Ajay
Top achievements
Rank 2
answered on 29 May 2009, 10:16 AM
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.

0
Shinu
Top achievements
Rank 2
answered on 01 Jun 2009, 07:58 AM
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
0
Ajay
Top achievements
Rank 2
answered on 01 Jun 2009, 09:07 AM
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 !!!

0
Shinu
Top achievements
Rank 2
answered on 01 Jun 2009, 10:18 AM
Hi Ajay,

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

Shinu
0
Ajay
Top achievements
Rank 2
answered on 01 Jun 2009, 10:28 AM
Hi shinu !


SKIN : Gray

VERSION :- 2008
0
Shinu
Top achievements
Rank 2
answered on 01 Jun 2009, 11:19 AM
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.
0
Ajay
Top achievements
Rank 2
answered on 01 Jun 2009, 11:33 AM
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.
0
Dimo
Telerik team
answered on 01 Jun 2009, 11:43 AM
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.
0
Ajay
Top achievements
Rank 2
answered on 01 Jun 2009, 12:42 PM
Hi Dimo !

Thanks a lot !!

 It really works !!

Great work....

You solved my problem.

Keep doing excellent work !!!!
0
Augusto Cosatti
Top achievements
Rank 1
answered on 03 Nov 2009, 01:45 PM
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  
0
Dimo
Telerik team
answered on 03 Nov 2009, 04:39 PM
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.
0
Augusto Cosatti
Top achievements
Rank 1
answered on 04 Nov 2009, 07:45 AM

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

 

Tags
Grid
Asked by
Ajay
Top achievements
Rank 2
Answers by
Shinu
Top achievements
Rank 2
Ajay
Top achievements
Rank 2
Princy
Top achievements
Rank 2
Dimo
Telerik team
Augusto Cosatti
Top achievements
Rank 1
Share this question
or