Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Scrollable tbody? #13

Open
sonyseng opened this issue Sep 18, 2020 · 1 comment
Open

Scrollable tbody? #13

sonyseng opened this issue Sep 18, 2020 · 1 comment
Labels
enhancement New feature or request

Comments

@sonyseng
Copy link

I'd like to set the table to expand to 100% of the parent container with the thead fixed and the tbody scrollable. Is there a configuration for this?

@dasDaniel
Copy link
Owner

👍gets a bit tricky...

One solution is to use css example: https://svelte.dev/repl/91c871dc626d40e0a5fac4296c9cdfe2?version=3.25.1

<style>
	:global(tbody) {
		height:250px;
		overflow:auto;
		display: block;
	}
	:global(thead, tbody tr) {
		display:table;
		width:100%;
		table-layout:fixed;
	}
</style>

the downside is that because it uses display block and 100% for the width, the column widths are all the same.

you can get around it with targeting individual columns using...

	:global(th:nth-child(4), td:nth-child(4)) {
		width: 60%;
	}

but it's not ideal

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Projects
None yet
Development

No branches or pull requests

2 participants