This still isn’t working the bullet points are way off to the left. Attached are the images after inputting the data provided in a previous potential solution. I would even cope with having the cloze deletions parts on the left as long as they are straight after the bullet points with the correct indentation
How do you want the card to look? Do you want to keep the text more-or-less centered, but with bullet points to the left? If you’re okay with the text in the list being left-justified, you could try adding this CSS:
li {
text-align: left;
}
If that doesn’t solve your problem, can you show us the HTML you’re using for that example card?
I want the answers to the cards to look like this with the correct indentation.
It can be orientated to the left or in the middle as long as the bulleted list and indentation are correct
Yes this is perfect, is there any way to align it to the middle but to keep how it is formatted with the words coming straight after the bullet point. If not doesn’t matter because this will do.
This is kind of a hacky solution but I think it will work. Add the following CSS to the Styling section:
.container {
max-width: 40vw;
margin: 0 auto;
}
This will center the area corresponding to the Back Extra field. The text within will still be left-aligned, but the field itself will be closer to the center of the window. The 40 means that the field is limited to taking up 40% of the width of the window; you may want to increase that number if the text area is too narrow.
I just didn’t think you’d need the aligned lists on the front as well, so I only used the container on the back.
HTML/CSS is very easy to learn, I can only recommend you get used to it, so you can get creative with your cards
You inserted the HTML for the front side into the Styling section (CSS).
That part needs to be in the Front Template
You just need to replace what’s currently in the Front Template with this (& delete it from the Styling section).
This is a much cleaner solution and works just as well. @GhostFlipper829 Sorry for any confusion I caused with my setup.
My originally suggested setup (from the other topic) works too, but it’s unnecessarily complex.
Container-setup
The style inline-block has to be applied to the parent element of the lists (<div class="container">), which is centered because of .card {...text-align:center;...}.
There’s no need to style the lists, they inherit text-align:left from the container class anyway.
Been doing it like this for a while and never noticed any issues.
@GhostFlipper829@Gueazy Many thanks for these two lines of elegant CSS code. I have been looking all over Google for just this bit of CSS for my Anki decks.