Border around Iamge

  • Hello

    How can I draw a Border around a Image Block. In the Classic Editor, it’s very easy by adding this CSS to the IMG tag: border: 1px solid silver;

    In the Block Editor, there is a CSS Field but no explanation on how to use it. I’m sorry, but I have no clue ??

    Thanks

Viewing 3 replies - 1 through 3 (of 3 total)

  • Totally agree, there is not yet enough documentation out there.
    In the Advanced > Additional CSS Class you can add a name, that identifies your particular styling, for instance “silver”.

    Then under the “Customizer” you see a section called “Additional CSS”. It allows you to add CSS that works for all your pages and posts and blocks, using the name you entered as Additional CSS class. (‘silver’)

    For the image you would add figure.silver {border:1px solid silver} and publish it.

    For any subsequent image you only need to add the same class name under “Advanced” and it will automatically add the border to the image.

    This methods keeps your posts/pages clean of additional coding and you have a single place where you can change it if you now decide to have a dotted line or a 2px line around particular images.

    Does that make sense to you? Did it work?

    Thread Starter Benjamin Stocker

    (@bstocker)

    Hello Birgit

    Thanks very much for your reply.
    And yes, that solved my problem 100% The borders are back!
    Thank you very much for your help.

    Kind regards, Benjamin

    Glad to read it works. You are welcome!

    There is also a check box under this thread to mark the issue solved. When you get a minute, would you please check it so others with a similar issue can get a head start on solving it, too.

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Border around Iamge’ is closed to new replies.