Custom CSS for table width?

The new tables look great however i’m unsure how to make the table take up the entire width of the screen.

I have the css class for the tables set to make the width 98% but it does not make the table stretch to the width of the screen, just the container for the table.

i took a look at the html and it looks like the table has an additional Div.wire-container that my css is not altering. Is there a way to figure out how to change that div css?

I’m completely lost.

Thank you for your time

Nathan,

image

What content width are you using in your Settings > Appearance?

I am using Large currently.

Sorry, The tables are not within a container at this time, my mistake.

Can you share your configurations? I’m not able to reproduce your screenshot.

For the table in the css class I put a random name “ultrawide98”

Then in settings - > Appearance - > Custom CSS

.ultrawide98 {
width: 98%!important;
}


You should turn on “Preview custom CSS” to see if it makes a difference.

I have, it does effect the width but not the actual table within.

I changed the background color to show you what its doing.

I think i figured it out.

I have to override the main div of the page

#main-root div[class*=“justify-center”] {
–container-x-pad: 10px;
max-width: 95vw;
}

…that was giving me a headache lol

Thank you for your help

1 Like

This should work for containers

div[class*="container-padding-md"]  {
max-width: 100vw;
}
1 Like

Thanks for the help.

That made a big difference.

1 Like