Issue with indent of bullet lists

Home Forums Technical Theme Support STAX Theme Issue with indent of bullet lists

Tagged: , ,

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #473589
    Christine Doyle
    Participant

    My new Stax site looks great… except that when I have a bulleted list where the items line wrap, the second line is not matching the first line indent.
    To make matters worse, it *looks ok* in the edit mode, but is wrong in the *view* mode.
    Site is still private, so am attaching a couple of screen grabs.
    Not sure if it makes a difference that this bullet list is within a toggle box (I wouldn’t think so)

    Attachments:
    You must be logged in to view attached files.
    #473849
    Christine Doyle
    Participant
    This reply has been marked as private.
    #473937
    David Morgan
    Keymaster

    Hi Christine,

    Thanks for reaching out! The rendered version on the frontend of the site is actually the intended display (with the indention). However, you can adjust this to look more like the editor by adding the following custom CSS:

    
    ul li {
        list-style: outside !important;
        list-style-type: disc;
        margin: 6px 0px;
        padding: 0px !important;
    }
    

    You can add this style in the Customizer or Site Editor. Let us know if this resolves the list item alignment.

    Thanks!

    • This reply was modified 2 weeks, 5 days ago by David Morgan.
    #473960
    Christine Doyle
    Participant

    well… I put this into the Additional CSS section in the Appearance > Customize section, and nothing changed.

    To clarify, the issue is that the second text line of a list is matching the indent of the bullet icon, not the first line of text, which is what one would expect in a text document. It’s just that little bit of annoying, and it’s not critical.

    Site is now live, so you can see it here, and open up the “Leadership” button.

    Curriculum Vitae

    Thanks.

    #474000
    David Morgan
    Keymaster

    Hi Christine,

    See attached screenshot. Is this not correct?

    Thanks!

    Attachments:
    You must be logged in to view attached files.
    #474002
    Christine Doyle
    Participant

    That’s what I’m seeing… but if it was a text document, the second line of text should align with the text, not the bullet point.

    The attached file is what it would look like in a word processor/print document. (and is also what it looks like in the edit view)

    Attachments:
    You must be logged in to view attached files.
    #474016
    David Morgan
    Keymaster

    Ah, I see what you mean.

    Try adding the following CSS (replacing previous):

    ul li {
        list-style: outside;
        list-style-type: disc;
        margin: 6px 0px 6px 18px;
        padding: 0;
    }

    This should fix the alignment.

    #474028
    Christine Doyle
    Participant

    in the Additional CSS section? Or somewhere else?

    I put it into the Additional CSS section, and nothing is changing.

    It’s not critical, it’s just annoying.

Viewing 8 posts - 1 through 8 (of 8 total)
  • You must be logged in to reply to this topic.