Make collapsible rows same size

[TrendBlend]

Hello,

I want to make my collapsible rows the same size becaude the middle one looks a bit smaller. Also I would like the text of the middle collapsible row to be more in the middle of the row. And lastly, I would like the icons and text to be bigger.

I hope someone is willing to help me with this! Thanks in advance!

[TrendBlend]

URL: https://trendblend.eu/products/controllable-led-curtain

[Rahul_dhiman]

Hello @TrendBlend 
Go to online store ----> themes ----> actions ----> edit code ---->base.css ----> line number 3849
search this code

#Details-collapsible_tab_jgHthG-template--23184790061395__main {
margin-top: -15px !important;
}

and replace with this code

#Details-collapsible_tab_jgHthG-template--23184790061395__main {
margin-top: 0px !important;
}

 result

If this was helpful, hit the like button and accept the solution.
Thanks

[Tech_Coding · Accepted solution]

Hello @TrendBlend 

You can add code by following these steps

1. Go to Online Store -> Theme -> Edit code.
2. Open your theme.liquid file

3. Paste the below code before </body> on theme.liquid
<style>
   #Details-collapsible_tab_jgHthG-template--23184790061395__main {
      margin-top: 0 !important;
    }

     #shopify-section-template--23184790061395__main .summary__title {
          display: flex;
          align-items: center;
     }
    .accordion__title {
        font-size: 20px !important;
    }
    .accordion .icon-accordion {
        height: calc(var(--font-heading-scale)* 3rem) !important;
        width: calc(var(--font-heading-scale)* 3rem) !important;
    }
</style>

my reply helpful? Click Like to let me know!
your question answered? Mark it as an Accepted Solution.