[steps to edits css files](https://forum.posit.co/t/how-to-increase-the-spacing-between-item-lists-in-a-revealjs-presentation-using-quarto/170579/2?u=tchevri)

I would like to follow up on this post and refer to this response in particular.
i tried @cderv solution, and it works great, obviously, awesome tip, thank you so much, but I ran into one unexpected issue, i believe. I passed my CSS rule as advised, but it was overridden and I do not know by what. In my case, I am using the revealjs metropolis template. I searched the template, but as a newbie, I could not find anything relevant.
When I inspect the html file as per Christophe's suggestion, I do see my command:

.reveal .slide ul li, .reveal .slide ol li {
    margin-top: 0.2em;
    margin-bottom: 0em;
}
(index.html:968)

but now the two margin commands are striked out. It's striken out and indeed, just above, there is:

.reveal .slide ul li, .reveal .slide ol li {
    margin-top: 0.4em;
    margin-bottom: 0.2em;
}
(index.html:1573)

no idea where this one comes from, but i do not want it! looking at the numbers, I am guessing it's overriding my command too.
I would like to check whether the solution is then to specify the following !important switch in my css file:

/* list items (li) within unordered lists (ul) */
.reveal .slides section ul li, .reveal .slides section ol li {
    margin-top: 0.2em !important;
    margin-bottom: 0em !important;
}

within my css file? is this the correct approach or am I doing something wrong and should be doing something else? This approach works, as it forces my css command to override the override!!, but I read that it's poor coding practice to be using !important, and worse, it could cause unexpected adverse effects. Is that true? What is your suggestion? thank you so much for any pointers and sorry for troubling you with this.

Yes it works. This is a matter of specificity of rules when you want to overwrite an existing one. Sometimes you can't do without !important

I would say this would it you were to develop some tools for others, as they would not be able to overwrite, and your rules would overwrite any other rules.

If you do that for your own document, then I think you are fine.

You could also try to be more specific in your CSS rule. See
https://specifi■■■■y.com/

1 Like

This topic was automatically closed 42 days after the last reply. New replies are no longer allowed.

If you have a query related to it or one of the replies, start a new topic and refer back with a link.