List Manager Forum

CSS not working for me

User Porter 2024-06-04 21:22:10

Hi.
I'm not entirely sure how to use stylesheets here. There seems to be nothing describing in the tutorial.
I'd like to have different widths in my three columns in the frontend.
Whenever I even try to save something in 'CSS', it doesn't stick.

Thank you!

Moonsoft support 2024-06-05 10:13:30

Hi,
in order to modify the default columns width, you can enter specific css styles for each one. For example, for the second column, you will want to change the width both of the header, and the first column cells, so this css should do the work:

.mstable th:nth-child(2), .mstable tr td:nth-child(2) {
flex-basis: 50% !important;
}

You can add this same block as many times as needed, changing the number(s) 2 for the column you want to configure, and the width percentage, for another value, or set another fixed one in px, like

flex-basis: 150px !important;

you only need to enter the block at the css section (no need to add the 'style' tag). If you have problems to save any content into the css section, then you can provide us with permissions to access the configuration and we'll take a look, maybe you have any security setting restricting that kind of content. You can also try to set these classes into your template css, as they have included the table manager selector, they won't affect to any other table of your site.

Please give it a try and let us know if you need further help.

Thanks, regards
Moonsoft Team

User Porter 2024-06-06 07:23:30

I've now tried to add some styles into my template.css and it works.
However, I still cannot save it to the component, which probably must
be done for each list right!?

I must be able to control the styles for each list and not have the same
settings for all them. I've submitted login information for superuser rights,
hope that's enough. Let me know otherwise!

Thanks!

Moonsoft support 2024-06-06 09:37:31

Hi,
right, if you set the default styles at your template css they will apply to all tables, unless you set the selector to apply only for specific modules. In your template, the outer div containing the modules sets the id="Mod110" (we guess the 110 is your module id), so if you want to set an style only for this module, the selector would be:

#Mod110 .mstable th:nth-child(2), #Mod110 .mstable tr td:nth-child(2){
flex-basis: 50% !important;
}

This will help you to manage all the styles from the same file at your template. But setting the above style into the list css section should do the work as well, in case you prefer to manage them separatedly. We have tried to enter your backend but with the test user you sent above we are not allowed to access, can you please recheck so we can investigate further?

Thanks, best regards
Moonsoft Team

User Porter 2024-06-06 16:26:30

Sorry about that, was not a Super User... corrected now!
Please try again!

Moonsoft support 2024-06-07 11:02:07

Hi,
ok, thank you .We found there was a conflict with the J5 installer and that specific css field, we have fixed and released a new version. We have already upgraded at your test site and now you should be able to save the css configuration for each list, please let us know if you find further problems.

Regards
Guillermo V.
Moonsoft Team

User Porter 2024-06-07 14:32:55

Splendid, now it works!

Cheers,
Patrick

Moonsoft support 2024-06-07 15:10:49

Perfect, we close this ticket with this solution then, please open a new one in case you have any other issue.


Regards
Guillermo V.
Moonsoft Team

...
CalcBuilder

Create dynamic calculators

Buy now!
...
List Manager

Build different lists for your site

Buy now!