Indenting a Bulleted (ul) List

• 

  rjbinney · Member · Sep 30, 2016 at 12:22 am

  • Copy link
  • Add topic to favorites

  I have some indented sections of text I would like to add a bulleted list to.

  Trouble is, the bullet feature (i.e.,

  and
  • ) aligns the bullets along the full left margin of the post, NOT the padded margin of the preceding and following paragraph.

    I tried adding <p style=”padding-left: 60px;”> to no avail.

    Thoughts?

    Thanks

    (btw, the paragraphs in question are at the end of this post http://wp.me/p7GDeK-7L

  The blog I need help with is: (visible only to logged in users)

• 

  kokkieh · Staff · Sep 30, 2016 at 3:04 pm

  • Copy link

  Hi there,

  You need to add the padding to the ul-tag, not to the p-tag that surrounds it. So,

  <ul style="padding-left: 30px;">
        <li>.....

  As the p-tag is already indented 30 pixels, you only need to indent the list another 30px to have it indented 60px.

  As you have the Premium Plan you can also create a class for indented lists and then add the CSS for that class in the Customizer.

  (Also note that if you want to paste code in the forums, please wrap it in backticks, otherwise it won’t be visible :) )

• 

  rjbinney · Member · Sep 30, 2016 at 6:01 pm

  • Copy link

  Thanks, I had tried that and it didn’t work.

  I do have my formats for list embedded in the CSS Customizer (hooray for me) but this is a special, one-off deal.

  I thought this was going to be an easy summer fun exercise, it has turned into a major CSS/HTML tutorial!

  Thanks

• 

  kokkieh · Staff · Oct 2, 2016 at 7:35 am

  • Copy link

  Are you saying adding the style to the ul tag didn’t work? It did when I tested it.

  In that case, try adding it to the individual li tags instead.