Jump to content

Disable Mobile Responsive Design for one page

Recommended Posts

  • Replies 7
  • Views 1.4k
  • Created
  • Last Reply

Add to Home > Design > Custom CSS

@media screen and (max-width:640px) {
div#block-10800d04541353455eb1+.row>.span-2 {
    width: 50% !important;
    float: left !important;
}
div#block-10800d04541353455eb1+.row>.span-1 {
    display: none;
}
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment
  • 3 months later...

Hi there I am trying to achieve the same effect for one page of my website as well. I want to keep the mobile site how it is, except for one page where I am trying to have 2 or 3 columns (rather than one). 

the site is under: https://opossum-amphibian-zl2f.squarespace.com

and the specific page I want one than one column for is the archive page: https://opossum-amphibian-zl2f.squarespace.com/archive 

Please let me know if you have any solutions! Thanks!

Link to comment
3 hours ago, laurenlauer said:

Hi there I am trying to achieve the same effect for one page of my website as well. I want to keep the mobile site how it is, except for one page where I am trying to have 2 or 3 columns (rather than one). 

the site is under: https://opossum-amphibian-zl2f.squarespace.com

and the specific page I want one than one column for is the archive page: https://opossum-amphibian-zl2f.squarespace.com/archive 

Please let me know if you have any solutions! Thanks!

Add to Home > Design > Custom CSS

@media screen and (max-width:767px) {
div#page-5f6b124f66f74b690e26952e>.row>.col {
    width: 50%;
}
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment
  • 3 months later...

Hi there @tuanphan!

I need help with the same thing. I either need the entire page to be locked so it cannot change for mobile OR I need the just the section that I've screenshotted below to remain the same for desktop/mobile. When it is stacked it doesn't make sense. I wish I could make it 1 image but they need to be linkable.

https://khaki-potato-c53d.squarespace.com/home

 

Thank you SO much.

Screen Shot 2021-02-24 at 10.48.44 PM.png

Link to comment
On 2/25/2021 at 1:49 PM, Madeline_34 said:

Hi there @tuanphan!

I need help with the same thing. I either need the entire page to be locked so it cannot change for mobile OR I need the just the section that I've screenshotted below to remain the same for desktop/mobile. When it is stacked it doesn't make sense. I wish I could make it 1 image but they need to be linkable.

https://khaki-potato-c53d.squarespace.com/home

 

Thank you SO much.

Screen Shot 2021-02-24 at 10.48.44 PM.png

Your site is private. can you setup password & share url?

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment
  • 1 month later...

Hi there, I also am trying to disable mobile styles on a single page that is nested on an index page, on the homepage of my site.  The home index page, where you can see the full flow of the page as users would encounter it, is https://www.nativeland.org , and the nested page is https://www.nativeland.org/work.  I'm in 7.0, Bryant template. Is there any easy way to do this? 

I tried adapting the CSS that you suggested, @tuanphan, and couldn't figure out how to make it work in this case.  I am hoping I can simply disable mobile styles on this one page so that it appears identical to desktops, or possibly have the same images appear in rows of 2 maximum (which would leave a remainder of 1 image in the third row, which I would want to center).

Many thanks!

Link to comment
20 hours ago, yomateyo said:

Hi there, I also am trying to disable mobile styles on a single page that is nested on an index page, on the homepage of my site.  The home index page, where you can see the full flow of the page as users would encounter it, is https://www.nativeland.org , and the nested page is https://www.nativeland.org/work.  I'm in 7.0, Bryant template. Is there any easy way to do this? 

I tried adapting the CSS that you suggested, @tuanphan, and couldn't figure out how to make it work in this case.  I am hoping I can simply disable mobile styles on this one page so that it appears identical to desktops, or possibly have the same images appear in rows of 2 maximum (which would leave a remainder of 1 image in the third row, which I would want to center).

Many thanks!

https://www.nativeland.org/work.

the url doesn't exist.

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.