[Resolved] How to Add Padding

Home Forums Support How to Add Padding

  • This topic has 7 replies, 2 voices, and was last updated 1 month ago by Leo.
Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #1501682
    Linda

    Hi Support,

    I saved a support article on doing this for an h6, but can’t seem to figure out how to apply it to my blog image.

    I’m stuck on what I put and where I put it.

      Do I name the class something in the Advanced – Additional CSS section on the page? If so, would a good name be “blog-image”?
      How do I write the actual CSS in Customizer – Additional CSS? Would it be something like this:

      blog-image {
          margin-right: 20px;
      }

      Apologies for being dense on this. I’ve been searching for CSS how to but can’t translate what I’ve read t what I’m trying to do!

      The page I’m testing this on is: http://stage.mygoforthegreen.com/crush-your-2020-goals-in-4-simple-steps/. The image is the one at the bottom with the bullet list to its right.

      Thanks for your help … once again,

      Linda

    #1501862
    Leo
    Staff
    Customer Support

    Hi there,

    The name of the class you’ve added is blog:
    https://www.screencast.com/t/TajwNAwf

    So your CSS should be this:

    .blog img {
        margin-right: 20px;
    }
    #1502770
    Linda

    Leo, thank you so much! I was close in my attempts, but forgot the dot before “blog” and I put a dash between it and image … and once I put “image” first!!

    Thanks, too, for checking out the page and for your screenshot so I could see the div name in the code.

    Will try this out and let you know how I do … and I’ll save this “tech tip” from you, too~

    Linda

    #1502792
    Leo
    Staff
    Customer Support

    Sounds good. A quick (free) course like this might be helpful:
    https://www.codecademy.com/catalog/language/html-css

    #1505430
    Linda

    Thanks, Leo. Love your course suggestion. I need to learn more about this whole area. Any learning I’ve done to date has been too hit and miss!

    Linda

    #1505513
    Leo
    Staff
    Customer Support
    #1509954
    Linda

    Hi Leo,

    Just did it. Worked perfectly! Thank you again. 🙂

    Linda

    P.S. Have just re-discovered Tom’s Simple CSS plugin. When I try to reduce space between heading and list on this page (https://mygoforthegreen.com/coaching), I can make it work with this code:

    h3 {
    margin-bottom: 5px
    }

    BUT it reduces space for all H3s on the page, which I really don’t want.
    So I tried this code to reduce space above the list:
    list {
    margin-top: 5px
    }
    BUT it doesn’t work. Is that because the spacing after H3 is set at the default?

    Is there a way around this?

    Thanks!

    #1510420
    Leo
    Staff
    Customer Support

    Can you open a new topic and specify which element I should be looking at?

    Sounds like you could really use that course I suggested.

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