Solved

How can I make text visible on mobile without affecting the desktop version?

Bahrikaan
Explorer
52 0 16

Hi,

 

On the desktop version the home page looks good. On the mobile version their are some imperfections. How do i make this text visible without changing something on the desktop version. Im talking about the text above view all.

 

Thanks

 

WhatsApp Image 2024-04-19 at 11.58.46.jpeg

Accepted Solution (1)

Anshul_arora
Navigator
390 112 78

This is an accepted solution.

Hello @Bahrikaan ,

I understand you are looking to make the text 'Whats Trending Now' visible on mobile screen

You can implement this change by adding below mentioned CSS code at the bottom of theme.liquid file before </body> tag and save.

<style>
@media screen and (max-width: 776px)
{
.section-header {
margin-block-start: 30px;
}
}

</style>

Output - https://prnt.sc/JKV-tBgSCPtg

Anshul_arora_0-1713522224028.png

 

I hope the code helps you.

Please share if you have any query.

Thank you.

Please remember to like and accept the solution to help other store owners.

For Shopify Design & Development | Custom Coding -Visit Here

View solution in original post

Replies 3 (3)

Bahrikaan
Explorer
52 0 16

Webshop URL: https://www.glowinh.com/

Anshul_arora
Navigator
390 112 78

This is an accepted solution.

Hello @Bahrikaan ,

I understand you are looking to make the text 'Whats Trending Now' visible on mobile screen

You can implement this change by adding below mentioned CSS code at the bottom of theme.liquid file before </body> tag and save.

<style>
@media screen and (max-width: 776px)
{
.section-header {
margin-block-start: 30px;
}
}

</style>

Output - https://prnt.sc/JKV-tBgSCPtg

Anshul_arora_0-1713522224028.png

 

I hope the code helps you.

Please share if you have any query.

Thank you.

Please remember to like and accept the solution to help other store owners.

For Shopify Design & Development | Custom Coding -Visit Here
Bahrikaan
Explorer
52 0 16

Thanks Anshul. Your code worked