Solved

How can I add a radius to collapsible content's inner rows in CSS?

hostilearth
Shopify Partner
38 0 6

Hi. Can someone please help me add a radius to the edges of the collapsible content's inner rows? I poked around CSS for a while without any success.

 

Screenshot 2024-04-04 183111 - Copy.png

Accepted Solution (1)

LuffyOnePiece
Shopify Partner
522 78 96

This is an accepted solution.

Hi @hostilearth,

 

Add This Css in your Edit Code > base.css File

 

.product__accordion .accordion summary {
    border-radius: 5px;
}


If this doesnot wok, please share preview url of the store.

 

If you require further help to optimize or customize your store, please don’t hesitate to reach out. If you find this information useful, a Like would be greatly appreciated. And if this solves the problem, please Mark it as Solution!

 

Best Regards,
LuffyOnePiece

Sandeep Pangeni
Need help with your store? sandeeppangeni17@gmail.com
For quick response, Contact In WhatsApp +9779867521184

View solution in original post

Replies 4 (4)

LuffyOnePiece
Shopify Partner
522 78 96

This is an accepted solution.

Hi @hostilearth,

 

Add This Css in your Edit Code > base.css File

 

.product__accordion .accordion summary {
    border-radius: 5px;
}


If this doesnot wok, please share preview url of the store.

 

If you require further help to optimize or customize your store, please don’t hesitate to reach out. If you find this information useful, a Like would be greatly appreciated. And if this solves the problem, please Mark it as Solution!

 

Best Regards,
LuffyOnePiece

Sandeep Pangeni
Need help with your store? sandeeppangeni17@gmail.com
For quick response, Contact In WhatsApp +9779867521184
hostilearth
Shopify Partner
38 0 6

For my specific case .accordion { } worked. I just drew a blank on it being called an accordion. Thank you.

suyash1
Shopify Partner
9266 1152 1495

@hostilearth - can you please share this page link?

To build shopify pages use pagefly
You are welcome to contact me - suyash.patankar@gmail.com , My timezone is GMT+5:30.
Paranormal story video using AI

PageFly-Garcia
Shopify Partner
460 74 128

Hi @hostilearth based on your image I believe that layout is an accordion element.

If your theme doesn't support this feature, you might need to consider hiring a developer to implement it for you. Alternatively, you could use a page builder app that allows you to add such elements directly into the editor without the need for coding. Then, you can drag the section from the page builder app back into your theme. Some page builder apps that could help include Shogun, PageFly ... Most of them have free plan.

Here is an example from template from PageFly:

PageFlyGarcia_1-1712302223102.png

Hope it helps! 

 

Cheers,
Garcia 

Please let me know if it works by giving it a Like or marking it as a solution!


PageFly - #1 Page Builder for Shopify merchants.


All features are available from Free plan. Live Chat Support is available 24/7.