ParamQuery grid support forum

General Category => Help for ParamQuery Pro => Topic started by: SHIN WOOCHUL on September 05, 2019, 11:58:09 am

Title: How can set Merged Cell inner object vertical-align center
Post by: SHIN WOOCHUL on September 05, 2019, 11:58:09 am

I merged Cell then my inner object like button,check box is located cell top.
I set column style align : center then it moved center, but It still vertical top.
So, I set css like this
.pq-merge-cell {
padding-top : 6vh;
}
but it make cell ugly and It is not same location what height difference;
So If you have good method to set vertical middle
please answer me

Title: Re: How can set Merged Cell inner object vertical-align center
Post by: paramvir on September 05, 2019, 01:44:17 pm

you can use column render method to add additional internal div to a merge cell and then vertical align with css.

Code: [Select]

columnTemplate:{render: function(ui){
if(ui.cls.indexOf('pq-merge-cell')>=0) //check for merge cell.
return "<div>"+ui.formatVal+"</div>";
}},


Code: [Select]

<style>
.pq-merge-cell div{
position: relative;
top: 50%;
transform: translateY(-50%);
}
</style>


Title: Re: How can set Merged Cell inner object vertical-align center
Post by: SHIN WOOCHUL on September 05, 2019, 01:49:00 pm

Thank you so much, It works , Your solution is good!!!
You're advice make me more better programmer