We’re with you. JoomShaper is offering a 20% Discount on all plans due to the impact of COVID-19

Support Offline : Mon - Fri / 10am - 6pm (GMT +6)

Your Time: Our Time:

Addon: People - Image size and alignment

Featured Lock Resolved Task
I have an issue with the Person addon and image customization.

First, how can I resize the image and maintain center alignment? I added the following CSS to the object:

.sppb-addon-persion .sppb-person-image,
.sppb-addon-person .sppb-person-image,
.sppb-person-information,
.sppb-person-introtext,
.sppb-person-social-icons {
text-align: center;
}

While this centers it, it is the full width of the column. I would like to scale this somewhat. I came across this CSS to adjust size, but it looses the center attribute. The addition of a size slider in the settings (for any image) would be very helpful here.

.sppb-person-image img.sppb-img-responsive {
width: 75%;
}

Do you have some suggestions to resolve this?
Thank you

2 Answers

Toufiq - Staff

More than a month ago #Permalink
Hi there,

Thanks for your query. First of all, We don't offer customization support & that's why We are very sorry. If you share a screenshot that you want to do exactly and your site URL. Then We will check & let you know.

-Thanks

JL

More than a month ago #Permalink
i was able to resolve the issue.

For anyone else who may have encountered this.

I used the following CSS to correct the issue:
- adds 20 pixels of padding to the top
- scales the person-image to 60% of column
- centers the name and title
- centers the info text
- limits info test to 90% of the column to provide space at edge
- adds 20 pixels of padding to the bottom

.sppb-addon-person .sppb-person-image,
.sppb-addon-person .sppb-person-image,
.sppb-person-social-icons {
display: block;
margin-left: auto;
margin-right: auto;
width: 60%;
padding-top: 20px;
}
.sppb-person-information,{
text-align: center;
margin-left: auto;
margin-right: auto;
}
.sppb-person-introtext {
text-align: center;
margin-left: auto;
margin-right: auto;
width: 90%;
padding-bottom: 20px;
}


There are no replies made for this post yet.
Be one of the first to reply to this post!

123

Templates

327491

Community Users

Newsletter

Don’t miss any updates of our new templates and extensions and all the astonishing offers we bring for you.
We never spam

Joomla! ® name is used under a limited license from Open Source Matters in the United States and other countries. JoomShaper.com is not affiliated with or endorsed by Open Source Matters or the Joomla! Project.

Connect Us