Scrollable datatable anc header/colmuns alignement

Post Reply
serenne
Posts: 84
Joined: 21 Jul 2015, 07:43

05 Nov 2019, 15:34

Hi Aragorn,

As the latest post on this subjects seems to be quite old (2015), I prefer posting the question :

I have the problem of alignment between the headers and the cell contents in one scrollable datatable, but only on chrome when the number of lines dose not requires scrolling (works fine in firefox)
Any idea ?
Kindest regards

aragorn
Posts: 3847
Joined: 29 Jun 2013, 12:38

23 Dec 2019, 08:36

Hi,

Sorry for the delayed response. Could you please the following css?

Code: Select all

<style type="text/css">
    .ui-datatable-scrollable-header *,
    .ui-datatable-scrollable-theadclone * {   
        -moz-box-sizing: content-box;
        -webkit-box-sizing: content-box;
        box-sizing: content-box;
    }
</style>
Fixed for next version.

Best Regards,

serenne
Posts: 84
Joined: 21 Jul 2015, 07:43

26 Dec 2019, 13:27

Hi Aragorn,

Applying this style as is didn't solved the problem. But ... looking in chrome dev, in the styles I found that I had :

Code: Select all

<div id="frmTourList:table:0:det" class="ui-datatable ui-widget ui-datatable-scrollable">
      <div class="ui-widget-header ui-datatable-scrollable-header">
            <div class="ui-datatable-scrollable-header-box" style="margin-right: 15px;">
So adding margin-right: 0px; to the style provided does the job ! it works !!

(do not ask me where this margin style comes from, I search and didn't find any reason from my point of view )

serenne
Posts: 84
Joined: 21 Jul 2015, 07:43

26 Dec 2019, 14:03

Apologize,
my answer was incorrect :
The margin-style:15px; is only there when the datatable has two few rows to scroll. and so the header is not aligned :
.....| header | <-- 15px margin
...... | cell |
...... | cell |

When the number of rows is enough to make it scroll this style is no more there.
As the end of the hedaer cell is aligned with the vertical srollbar, left side is no more aligned with the beginging of the cell :

.....| header |
| cell |S|
^
(vertical scrollbar)

But applying your style in my xhtml page doesn't seems to have any effect...

aragorn
Posts: 3847
Joined: 29 Jun 2013, 12:38

27 Dec 2019, 08:18

Hi,

Thanks a lot for the info. Could you please try it without Ultima?

Best Regards,

serenne
Posts: 84
Joined: 21 Jul 2015, 07:43

13 Jan 2020, 11:14

yes I will try with mirage !

aragorn
Posts: 3847
Joined: 29 Jun 2013, 12:38

14 Jan 2020, 08:46

Ok, Thanks a lot!

Best Regards,

Post Reply

Return to “Ultima - PrimeFaces”

  • Information
  • Who is online

    Users browsing this forum: No registered users and 2 guests