Align filter buttons

Solved

Align filter buttons

TBS2023
Shopify Partner
97 1 7

Hello

How can i align these 2 buttons please?

www.thebodyshop.com.lb

Dosawr

 

TBS2023_0-1718366230808.png

 

Accepted Solution (1)

GTLOfficial
Shopify Expert
257 47 49

This is an accepted solution.

Hello @TBS2023 
Go to online store ---------> themes --------------> actions ------> edit code-------> Theme.CSS-------> line number 13782
and delete

.btn {
     margin-top: 10px; 
}

the result will be
kl.png

Let me know , if not solved.
Thanks

- Buy me a Pizza
- If helpful then please Like and Accept Solution.
- Want to modify or custom changes or bug fix on the store Hire me. GTL web solutions
- Want Complete Storefront: Send an email ⇨- Email: info@gtlofficial.com - Skype: ritesh_27dh

View solution in original post

Replies 4 (4)

suyash1
Shopify Partner
9545 1193 1531

@TBS2023 - please add this css to the very end of your theme.css file and check

.collection-filter {align-items: flex-start;}
button.js-drawer-open-collection-filters.btn {margin-top: 0;}
Support me | To build shopify pages use pagefly | You are welcome to contact me - suyash.patankar@gmail.com , My timezone is GMT+5:30.

dws_pvt_ltd
Shopify Partner
25 7 7
Hello @TBS2023 
 

Step 1: Go to Shopify Admin -> Online Store ->Theme -> Edit code
Step 2: Search file base.css, theme.css, styles.css, custom.css or theme.scss.liquid
Step 3: Insert the below code at the bottom of the file -> Save

 

 

@media screen and (max-width: 749px) {
	.collection-filter__item.collection-filter__item--drawer button.js-drawer-open-collection-filters.btn.btn--tertiary {
		margin-top: 0;
	}
}

 

dws_pvt_ltd_0-1718366863717.png

 

 
Best Regards,
Dws_pvt_ltd
Helpful? then please Like and Accept the Solution.
For any inquiries, please feel free to contact via WhatsApp and Email: sales@dolphinwebsolution.com.
For more information visit our website Dolphin Web Solution Pvt Ltd.

parth_ghelani
Shopify Partner
74 12 12

Hello @TBS2023 

Sorry for the issue you are facing, i've checked and find the solution for it.

Here, you just need to follow below steps:

   1. In your Shopify Admin go to online store > themes > actions > edit code
   2. Find Asset > theme.css and paste this at the bottom of the file:

 

.collection-filter button.js-drawer-open-collection-filters {
 margin-top: 0;
}

 

Hope this solution works fine for your issue.

If the solution works, then accept and like the solution.

Thanks and best regards !!

Parth Ghelani

GTLOfficial
Shopify Expert
257 47 49

This is an accepted solution.

Hello @TBS2023 
Go to online store ---------> themes --------------> actions ------> edit code-------> Theme.CSS-------> line number 13782
and delete

.btn {
     margin-top: 10px; 
}

the result will be
kl.png

Let me know , if not solved.
Thanks

- Buy me a Pizza
- If helpful then please Like and Accept Solution.
- Want to modify or custom changes or bug fix on the store Hire me. GTL web solutions
- Want Complete Storefront: Send an email ⇨- Email: info@gtlofficial.com - Skype: ritesh_27dh