Jump to content

Website doesn't fit on the mobile screen

Recommended Posts

Site URL: https://www.trickortreatyourcellf.com

Hello everyone,

I use a Bedford template and on my computer and Ipad the website fits the screen exactly the way I want it to be. But for some reason it doesn't fit the mobile screen.

Maybe it's important to mention that I used these CSS codes to customize the screen:

 

#page, #content {max-width: 90% !important;}

 

@media screen and (max-width: 640px) {
}

 

The first CSS code to adjust the dekstop screen worked. But the second one didn't work for the mobile screen.
Is there another CSS code I can use to make it fit?

 

 

Thank you in advance,

 

 

Cynthia

Link to comment
  • Shinelikeastar changed the title to Website doesn't fit on the mobile screen
  • Replies 7
  • Views 3.8k
  • Created
  • Last Reply

So what you need is a tweak or code to make the site wider in mobile view, there is a vertical space down the right side. That is what I saw in mobile view on my desktop. 

I found this code that addresss this problem with another 7.0 template. Curious the code you said that didn't work is the same as this but with a smaller px count. The first code you posted does  work. Did the first code snippet cause a problem? 

@media screen and (max-width: 767px) {
  .gallery-fullscreen-slideshow[data-height="L"] {
    height: auto !important;
  }
  .gallery-fullscreen-slideshow-item img {
    object-fit: contain !important;
  }
}

 

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.