Scrollable Wicket datatable with headers fixed - wicket-1.6

I want to create a Datatable with headers fixed and body scrollable. I tried with out Headers Tool Bar and created Headers manually in HTML page. But table content and Headers are not getting aligned properly. If lengthy column is there, table content is moving left and headers are fixed there.

Without much information I would say this is not a wicket issue and instead a CSS problem. You should look into using CSS to style the table and header

Related

how can I make image stay visible on the page even if user scroll page?

I need to have a image in a fixed position on my page. It should preferably stay visible all the time for the user. In the image below is a example of my page. On the top is the header and in the bottom the footer, and to the left is a table with data that can contain a large amount of data that would make the table very large in height. I would therefore like the image to stay in a fixed place even if I scroll the page to see the data in the left table. But the image must not go below the table (not over the footer), and not over the table (not in the header).
Hope this make sense :). I have tried the bootstrap positions https://getbootstrap.com/docs/4.0/utilities/position/ but they don't work as I need here. Can someone please help out?

Clarity Design Table component sticky header

I am using the table component from Clarity Design v2. Is there a way to make the vertical header and horizontal header to freeze while scrolling the table or page?

CSS grid template for Webapplication with big datatable

For the project I have the following Layout:
The content of the page should use the entire space on the screen since the table will be very big. I think a responsive layout is the right for that.
The header contains two Logos which float to the left and a Login block floating to the right side.
In the content area the Navigation box will be always on the left side. Next to it is the table. In the table rows and columns can be added, that is why the table can get very big and should use all the available space. At some point a horizontal slider makes it possible to scroll the table left and right.
Under the content the fototer contains four boxes with additional Information.
What is the best grid solution to realize this kind of Web application?

how do i stop my div tags from overlapping the header

Ok so i am trying to create a 3 column layout with css and html on Expression web and when i view it in a browser my left panel div column overlaps my heading div column and my right panel div column overlaps the header also.Plus theirs a lot of white space between my main content column and my right panel column. Its no white space in between the layout when its minimized but it still overlaps.please help
I'm not sure what your specific problem is without seeing your code. I find the best way to learn CSS is by example. so, I'd suggest looking through these.
(I haven't looked to see if these are using the latest design standards)
http://layouts.ironmyers.com
Or my favorite layout.
http://alistapart.com/article/holygrail

Centering content vertically (and horizontally) in a div

First the example: http://jsfiddle.net/5S3mk/3/
I have a table whose columns need to be sortable so in the table header there should be links for sorting. The columns themselves are dynamic and their width is not known in advance.
In order to center the header content horizontally I used the recipe from here.
Now I'm having trouble with adjusting the spans inside container div to center vertically. Does anyone have any idea how to do this (legacy browser are not an issue)?
Here you have one way of doing it. It uses a little jQuery script, but it is really simple.

Resources