PDA

View Full Version : GridPanel - Column headers and row data are not aligned



shahdollie
14 Mar 2011, 3:28 PM
hi everyone,
I have a gridpanel and 5 columns in that. Problem is that column headers and row data are not aligned. I believe its just the problem in my project only as when i create an example with the same code then everything works fine. Check the following image:


25136


Can anyone suggest what could be the problem?


Regards

Mthor
14 Mar 2011, 6:04 PM
Can you show some code? You will get more help responses with code shown.

shahdollie
14 Mar 2011, 6:56 PM
Hi

The problem is code works fine when i create it in separate file. So there is no problem with the code. It just doesn't work in one of my projects (though in others it works fine.......)....

Strange problem........I tried to solve this for a week or so and i couldn't find any problem that might be causing this.....so only i m asking for any suggestions that might be causing this...

Regards

shahdollie
14 Mar 2011, 9:32 PM
hi everyone....there was some problem with CSS.

Thanks for helping.

Regards

zerba78
9 Jun 2011, 5:28 AM
hi everyone....there was some problem with CSS.

Thanks for helping.

Regards

Hi shahdollie
how did you solve the issue?
how did you modify the CSS?
Best regards

shahdollie
13 Jun 2011, 2:20 PM
hi Zerba78, sorry i don't know which properties were affecting as i had a huge css file (created by someone else) so I discarded it and everything worked fine.

Regards

shahdollie
24 Jul 2011, 3:21 PM
Hi everyone,

The following css was causing the problem:


table caption,
table th,
table td {
padding: 0.1em 0.5em 0.1em 0.5em;
margin: 0.1em;
vertical-align: top;
}Hope that helps someone.
Regards

6 Dec 2012, 4:36 AM
Hi all,
If you want to apply this solution to only specific Grid Panel when there are multiple Grid Panels are there then use below css :

#sample_grid_id table caption,table th,table td {
/* padding: 0.1em 0.5em 0.1em 0.5em;
margin : 0.1em;
vertical-align: top;
*/
padding : 0px !important;
margin : 0px !important;
}

Note: Above #sample_grid_id is the id of specific Grid Panel. So, this solution is applied to only specific Grid Panel when there are multiple ExtJS Grid Panels.

Thanks & Regards