1. Home
  2. Knowledge Base
  3. Customizations
  4. CSS
  5. How to Change Profile Page Corners to Rounded After Adding Padding

How to Change Profile Page Corners to Rounded After Adding Padding

Introduction

After adding padding at the top of the Profile page, you may notice that the top corners are no longer rounded. By default, there is no built-in option to automatically restore rounded corners when padding is added. However, you can apply a custom CSS snippet to round the top corners of the Profile cover area again.

Custom Workaround

Follow the steps below to restore rounded corners on the Profile page:

  1. Go to Theme Options
  2. Under Custom Codes, enable CSS
  3. Append the following code:
body.bbp-user-page div#cover-image-container {

    border-top-right-radius: 5px;

    border-top-left-radius: 5px;

}

body.bbp-user-page div#header-cover-image {

    border-top-right-radius: 5px;

    border-top-left-radius: 5px;

}
  1. Save your changes.

Note: Any modifications are considered custom work already. Know more about our Support policy here: https://buddyboss.com/support-policy/

Troubleshooting and FAQs

Q: The corners are still not rounded after adding the CSS.

A: Clear your browser cache, site cache, and any CDN cache, then reload the Profile page.

Q: Can I change the roundness of the corners?

A: Yes. You can adjust the 5px value to a higher or lower number to increase or decrease the roundness.

Q: Will this affect other pages?

A: No. This CSS only targets the Profile page.

Was this article helpful?

Related Articles

Subscribe to Our Newsletter

Stay In Touch

Subscribe to our Newsletter, and we’ll send you the latest news from BuddyBoss

This field is for validation purposes and should be left unchanged.
This field is hidden when viewing the form

To speak to our Agency consultant, fill in the form found at our Contact Page.