CSS for border around text

Hi Chandra,

The CSS for adding boarder is super simple, the difficult part is to find the right CSS selector.

Can you link us to your site and point us to the sections that you want to add border to?

Let me know :)

So I'm just playing around with the site at the moment. I haven't really added content to it yet.

The site is: http://www.TheGreenCent.com

Could you give me an example of how I would create a 6 px blue border around the first two paragraphs on the sample page?

Once I do this once, I'll feel like I can do it moving forward.

Thanks for the quick response back, btw...

Chandra

There's no class added to a normal paragraph block.

As you can see in html, it's just ap. This kind of element is very difficult to target.
https://www.screencast.com/t/5bfWlHAwti

So if you want to target it, you can add a class border-text to it, please refer to the screenshot below:
https://www.screencast.com/t/Wo7l7KLa

Then you can try some CSS like this:

p.border-text {
    border: 6px solid blue;
}

Let me know if this helps :)

Hi,

Your help has been spot-on! Thanks for that.

I've been playing around with the css but I am a bit frustrated, because I'm trying to contain an h2 and paragraph and an image inside the border.

How would I do this?

Thanks,

Chandra

Hi Chandra,

Can you specify an instance on your site where you want this to be applied on?

So we can inspect it and get the proper selector that wraps all the image, h2 and p tags. :)

Yeah, so I'm creating a new site. I basically want to create something very similar to what you see here: https://bestllcservices.com/

I want to contain a CTA button, image, h2, and paragraphs all within the same border. I want to do this to separate out one company being reviewed, from another. Just like what they're doing at https://bestllcservices.com/

In this case, I would recommend to use Generateblocks plugin as block editor.
https://wordpress.org/plugins/generateblocks/

I think the Container block from Generateblocks is what you are looking for, you can add all these images/text to a Container block, and you won't need to write CSS, it comes with built-in border settings.
https://docs.generateblocks.com/article/container-overview/