Indenting bulleted / numbered lists in Elemin

Home › Forums › Automattic › Elemin › Indenting bulleted / numbered lists in Elemin

Tagged: , ,

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • December 20, 2016 at 8:31 pm #163961 Resolve

    Mike
    Member

    Currently, it doesn’t seem possible to indent a bulleted / numbered list in the Elemin theme. Is anyone aware of a a workaround for this?

    Thanks!
    Mike

    The blog I need help with is aimlong.ca
    December 21, 2016 at 5:19 pm #163962

    Chad Chadbourne

    Hi Mike!

    Are you trying to indent the entire list, so there is extra space to the left?

    It looks like the Elemin’s unordered lists (bulleted lists) have a smaller indent than ordered (numbered) lists, which are indented when I compare the two on this page:
    https://elemindemo.wordpress.com/html-elements/

    That may have been an intentional decision in the design of the theme, I’ve opened a request for it to be looked into and fixed if needed.

    In the meantime, there are two ways to fix it.

    First, with Custom CSS, which is part of a Premium Plan or Business Plan, you can add the following snippet to My Site > Customize > CSS to make increase the left margin of all of your site’s unordered lists:

    .entry-content ul,
.comment-content ul {
    margin-left: 32px;
}

    The second option, if you don’t have that upgrade, would be to add the margin to each list you create, manually in your post or page HTML editor.

    For example, if you created a list like this:

    • Item one
    • Item two
    • Item three

    and clicked over to the HTML tab, the code would look something like this:

    <ul>
<li>Item one</li>
<li>Item two</li>
<li>Item three</li>
</ul>

    We can add a bit to the opening <ul> tag, like this:

    <ul style="margin-left: 32px">

    to increase the left hand spacing for just this one list. :)

    If this isn’t what you meant, can you describe the problem in more detail, I’ll be happy to take a look!

    December 23, 2016 at 3:31 pm #163963

    Mike
    Member

    Hi Chad, Thank you for your tip.

    Yes, you’ve understood my conundrum… I wanted to indent the entire list, to have extra space on the left.

    I DO in fact have the premium upgrade, so I just tried the CSS code you included (Thanks much… I’m not a CSS ninja) and it worked like a charm.

    I appreciate your help!

    December 28, 2016 at 3:23 pm #163965

    Kathryn P.
    Happiness Engineer

    Great! Glad Chad’s code did the trick. Feel free to start a new thread if you need help with anything else.

    December 28, 2016 at 4:06 pm #163966

    Kathryn P.
    Happiness Engineer

    Hi Mike – this issue has been fixed within the theme. You should be able to remove the custom CSS Chad gave you earlier and see the indenting.

  • Author
    Posts
Viewing 5 posts - 1 through 5 (of 5 total)

You must be logged in to reply to this topic.