Jump to content

Archived

This topic is now archived and is closed to further replies.

dreja

Table with a fixed top row/header?

Recommended Posts

dreja

Hi,

I have a long table and I'd like to find a way to have the header stay fixed while the other content scrolls. Is there such a thing as a "fixed" class that I can add? If tried looking it up on http://getbootstrap.com/css/ but I didn't find anything that would help.  I've also seen other solutions online that involve jquery but I'm not sure they are compatible with DMS. 

Anyone have a suggestion? 

Thanks!

Share this post


Link to post
Share on other sites
Aires

Can we see the site in question?


ndTgvai.jpg

Visit iheartpagelines.com for the latest tutorials on PageLines related products.

 

Share this post


Link to post
Share on other sites
dreja

Can we see the site in question?

Hi Aires, 

Thanks for your help.

I've created this dummy page as an example:

I'd like to fix the top row (title) and have everything else scroll.

Share this post


Link to post
Share on other sites
Aires

Hi,

Well I played with it for  a few and I ran into some issues when trying to fix the table head to the top.

Because the theader is part of the table when it is fixed the column are not aligned and the Theader is out of flow.

I am sure this is possible to have a fixed table header and have it remain part of the table it going to take further research.

You can see my attempt here http://mytestdesigns.pw/test-page/   jquery and css was used.

~Aires


ndTgvai.jpg

Visit iheartpagelines.com for the latest tutorials on PageLines related products.

 

Share this post


Link to post
Share on other sites
dreja

Thanks @Aires for your help! I'm curious, when you have custom jquery like this where do you add it in pagelines/wordpress in order for it to work? Functions.php? Or do you make your own plugin?

Share this post


Link to post
Share on other sites
Aires

Hi,

In this instance I just added it to the header/script area because it is only a test site. Normal i would enqueue the script in the functions.php of a child theme

http://mytestdesigns.pw/test-page/

I didn't publish the site so the changes can be seen it is published now with the jQuery so you can see it sticking.

Aires


ndTgvai.jpg

Visit iheartpagelines.com for the latest tutorials on PageLines related products.

 

Share this post


Link to post
Share on other sites
dreja

Thanks for your explanation I really appreciate it! 

Share this post


Link to post
Share on other sites

×