Solved

Adjust the width in custom css

gemlette
Tourist
9 0 5

Screenshot 2024-05-25 at 1.14.05 PM.jpg

 

I added a custom liquid for a Q&A section but the width is not following the page. 
What is the custom CSS code to adjust the width 


Accepted Solutions (2)

suyash1
Shopify Partner
9372 1168 1505

This is an accepted solution.

@gemlette - add this css to the very end of your .collapsible-content.css file and check

.collapsible-content-wrapper-narrow{max-width: 100em;}

 

suyash1_0-1716640379983.png

 

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

View solution in original post

devcoders
Shopify Partner
190 31 47

This is an accepted solution.

Hi @gemlette 

Go to Online Store, then Theme, and click on Edit code.
Locate the file assets/base.css, and paste the code provided below at the end of the file.

.section-template--17895793950964__custom_liquid_jD7pgE-padding {
margin: 0 auto;
padding-right: 1.5rem;
padding-left: 1.5rem;
max-width: 73.4rem;
}

 

Shopify Developer: Helping eCommerce Stores
If you need assistance with your store, feel free to contact us at devcodersp@gmail.com.
If my assistance was helpful, please consider liking and accepting the solution. Thank you!

View solution in original post

Replies 9 (9)

devcoders
Shopify Partner
190 31 47

Hi @gemlette 

 

If you share your store URL and password with me, I will check and provide you with the solution.

Shopify Developer: Helping eCommerce Stores
If you need assistance with your store, feel free to contact us at devcodersp@gmail.com.
If my assistance was helpful, please consider liking and accepting the solution. Thank you!
gemlette
Tourist
9 0 5
gemlette
Tourist
9 0 5

Oh. just looking at it now. For some reason, the width changed 

gemlette
Tourist
9 0 5

https://gemlette.com/pages/faq-2

sorry Wrong URL. 
here you go 

devcoders
Shopify Partner
190 31 47

Hi @gemlette 

 

Go to Online Store, then Theme, and click on Edit code.
Locate the file assets/plain-jane.css, and paste the code provided below at the end of the file.

 

.section-template--17895793950964__custom_liquid_jD7pgE-padding {
margin: 0 auto;
padding-right: 1.5rem;
padding-left: 1.5rem;
max-width: 73.4rem;
}

 

devcoders_0-1716640138663.png

 

 

Shopify Developer: Helping eCommerce Stores
If you need assistance with your store, feel free to contact us at devcodersp@gmail.com.
If my assistance was helpful, please consider liking and accepting the solution. Thank you!
gemlette
Tourist
9 0 5

I don't have assets/plain-jane.css

devcoders
Shopify Partner
190 31 47

This is an accepted solution.

Hi @gemlette 

Go to Online Store, then Theme, and click on Edit code.
Locate the file assets/base.css, and paste the code provided below at the end of the file.

.section-template--17895793950964__custom_liquid_jD7pgE-padding {
margin: 0 auto;
padding-right: 1.5rem;
padding-left: 1.5rem;
max-width: 73.4rem;
}

 

Shopify Developer: Helping eCommerce Stores
If you need assistance with your store, feel free to contact us at devcodersp@gmail.com.
If my assistance was helpful, please consider liking and accepting the solution. Thank you!

suyash1
Shopify Partner
9372 1168 1505

This is an accepted solution.

@gemlette - add this css to the very end of your .collapsible-content.css file and check

.collapsible-content-wrapper-narrow{max-width: 100em;}

 

suyash1_0-1716640379983.png

 

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
gemlette
Tourist
9 0 5

Excellent. Works well. thanks