CMS Development

Jamila-lawal
Participant

Circle border for author image

Résolue

Hello all,

 

I'm currently working on this page, and i'd like to add a circle border to the author image (please see image 1) so that it looks like image 2 (this was created manually).

 

image 1image 1

 

image 2image 2

 

Any advice on this would be greatly appreciated 🙂

 

Thanks,

 

Jamila 

0 Votes
2 Solutions acceptées
Jaqueline
Solution
Contributeur | Partenaire solutions Platinum
Contributeur | Partenaire solutions Platinum

Circle border for author image

Résolue

Hi Jamila,

 

Check the css class of your image or the div around depending on your code. For example in our blog there is an image wrapped in a div like this <div class="sidebar-authorImage"><img...></div> 

 

Then add this to your CSS:

 

.sidebar-authorImage {

    border-radius: 100%;

    border: 1px solid #ffffff;

}

 

Depending on the class you are using, you need to replace the "sidebar-authorImage" with your class. The border in this example is 1px and white. For sure, you can change width and color.

 

Hope this helps you.

 

Best ragards,

Jaqueline

 


Jaqueline Hoppe
jhoppe@w-4.com
Digital Marketing Consultant, HubSpot Specialist & HubSpot Certified Trainer

W4 – Marketing meets IT
Zurich // Basel // Dresden // Bratislava // Beijing // Gujranwala
www.w-4.com

Voir la solution dans l'envoi d'origine

Solution
Anonymous
Non applicable

Circle border for author image

Résolue

Adding a CSS rule like this should do the trick:

.hs-author-avatar img {
border-radius: 50%;
border: 2px solid #000;
}

You can then adjust the width and color for the border declaration. Hope that helps!
--
Bryan Schneidewind
Manager of Web Development
Weidert Group

Voir la solution dans l'envoi d'origine

2 Réponses
Solution
Anonymous
Non applicable

Circle border for author image

Résolue

Adding a CSS rule like this should do the trick:

.hs-author-avatar img {
border-radius: 50%;
border: 2px solid #000;
}

You can then adjust the width and color for the border declaration. Hope that helps!
--
Bryan Schneidewind
Manager of Web Development
Weidert Group

Jaqueline
Solution
Contributeur | Partenaire solutions Platinum
Contributeur | Partenaire solutions Platinum

Circle border for author image

Résolue

Hi Jamila,

 

Check the css class of your image or the div around depending on your code. For example in our blog there is an image wrapped in a div like this <div class="sidebar-authorImage"><img...></div> 

 

Then add this to your CSS:

 

.sidebar-authorImage {

    border-radius: 100%;

    border: 1px solid #ffffff;

}

 

Depending on the class you are using, you need to replace the "sidebar-authorImage" with your class. The border in this example is 1px and white. For sure, you can change width and color.

 

Hope this helps you.

 

Best ragards,

Jaqueline

 


Jaqueline Hoppe
jhoppe@w-4.com
Digital Marketing Consultant, HubSpot Specialist & HubSpot Certified Trainer

W4 – Marketing meets IT
Zurich // Basel // Dresden // Bratislava // Beijing // Gujranwala
www.w-4.com