Jump to content

Desktop View Too Large

Recommended Posts

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

Hello! So I was able to apply CSS code for my mobile view make it look nice on phones, but recently I went to look at my desktop view and it looks HUGE! I cannot find any coding anywhere to make it smaller. When I log into my website from my squarespace account, the size looks perfect so I assumed the desktop view was fine, but I was sadly mistaken. Can someone please provide guidance? 

Link to comment
  • Marcus_SQSP changed the title to Desktop View Too Large

Hi, can you share a few details about what looks huge on the desktop version? The CSS that you applied to the mobile version, did you use media queries so it only applied to mobile? Can you share a couple of screenshots to show the demonstrate the different you're seeing in the logged in and live version?

Please like and upvote if my comments were useful to you. Thanks!

Zygmunt Spray
Squarespace Website Designer
Contact me: https://squarefortytwo.com/ 
🔌Ghost Squarespace Plugins (Referral link)
Buy me a coffee

Link to comment
On 10/5/2022 at 1:11 PM, Amanda-FWI said:

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

Hello! So I was able to apply CSS code for my mobile view make it look nice on phones, but recently I went to look at my desktop view and it looks HUGE! I cannot find any coding anywhere to make it smaller. When I log into my website from my squarespace account, the size looks perfect so I assumed the desktop view was fine, but I was sadly mistaken. Can someone please provide guidance? 

I see you changed to Site Title Text. Do you still need help on this?

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

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment

here is the mobile code I use 


/* CSS FOR MOBILE */
@media only screen and (max-width: 640px) {
/* Start Insert Code for Mobile*/

// Header h1
 h1 {font-size:3rem !important} 

// Header h2
 h2 {font-size:2rem!important} 

// Header h3
 h3 {font-size:1.5rem !important} 

  // Header h4
 h4 {font-size:2rem !important} 
  
// Paragraph

 p {font-size:1.1rem !important} 
   
  
  p {
    margin-top: 1px;
    margin-bottom: 1px;
}
  
  // bold copy text
p strong
{
font-weight: 600
}
  

  
  
/* End Insert Code for Mobile*/
}

Link to comment
On 10/14/2022 at 1:00 AM, Amanda-FWI said:

my newsletter box also looks really big on mobile and I can't find code for it 

Add to Design > Custom CSS

div#block-yui_3_17_2_1_1665650003829_164747 .newsletter-form-field-element {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
    font-size: 12px !Important;
}

 

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

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • 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.