How to increase the size of an custom html on mobile but keep it the same on desktop

Solved
dazorpad
New Member
4 0 0

So I've recently added three images to my homepage. I've adjusted the margins and its perfect to how I want it. 

help 1.PNG

When I go to the mobile version, I want it to be able to fit the whole screen but keep the margins the same. 

help 2.PNG

this is the code I used for the desktop version to adjust my margins

div#shopify-section-1601753320176{
margin-top: 15px;
margin-bottom: 0px;
}
 
div#shopify-section-1601752092609{
margin-top: 0px;
margin-bottom: 0px;
}
 
div#shopify-section-1601755252885{
  margin-top: 0px;
  margin-bottom: 0px;
    }
 
 
0 Likes

Hello,

Thank you for your question.

Please share:
- your store URL;
- page URL with the issue you mention;
- storefront password (if your store has one).

I'll help you out to the best of my ability.

Kind regards,
Diego

◦ Problem Solved? ✔️ Please click on Accept as Solution and like.
◦ Using a free theme? Improve it with copy/paste code snippets clicking here.
◦ Looking to hire an experienced developer? Same day response: ezfycode@gmail.com.
dazorpad
New Member
4 0 0

Hello Diego,

 

Store URL: shoprmnalxndr.com

Page URL: https://shoprmnalxndr.com/ (homepage)

Password: giyows

 

Thank you

0 Likes

This is an accepted solution.

@dazorpad 

Do this to fix it in 20 seconds:

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

 

@media (max-width:991px){
    [data-section-type="custom-html-section"] .page-width{
    padding: 0 !important;
    margin: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
}
}

 



Please let me know whether it works.

Kind regards,
Diego

◦ Problem Solved? ✔️ Please click on Accept as Solution and like.
◦ Using a free theme? Improve it with copy/paste code snippets clicking here.
◦ Looking to hire an experienced developer? Same day response: ezfycode@gmail.com.
0 Likes
dazorpad
New Member
4 0 0

Thank you very much for your help! It worked!

0 Likes

You're welcome, glad to hear that!

◦ Problem Solved? ✔️ Please click on Accept as Solution and like.
◦ Using a free theme? Improve it with copy/paste code snippets clicking here.
◦ Looking to hire an experienced developer? Same day response: ezfycode@gmail.com.
0 Likes