Jump to content

Increasing the Logo Size for Mobile using the Bedford Template

Recommended Posts

Good afternoon, 

I have been attempting to increase the logo image size for the mobile view. I have tried several different methods found in the forums, such as the one included below:

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

#logo {
    height: 100% !important;
    max-height: 100% !important;
    width: auto;
    max-width: 100% !important;
    }
}

The website is: ubcontractor.com

I am using the Bedford Template. 

Would greatly appreciate any help. Thank you so much. 

Link to comment

Add to Home > Design > Custom CSS

@media screen and (max-width:640px) {
#logoImage img {
    max-width: 300px !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
  • 3 months later...

Hello and thanks in advance for any help you may be able to offer.

I am having similar mobile logo issues. The logo is too small on mobile and I can't seem to increase its size. I have tried the code kindly suggested by @tuanphan BUT sadly I don't get any results. 

@media screen and (max-width:640px) {
#logoImage img {
    max-width: 300px !important;
}}

I do get some action if I change 'max-width' to 'min-width' but this does not maintain ration.

Any help would be ever so appreciated. Thanks, Alex  

Link to comment
11 minutes ago, AlexCP said:

Hello and thanks in advance for any help you may be able to offer.

I am having similar mobile logo issues. The logo is too small on mobile and I can't seem to increase its size. I have tried the code kindly suggested by @tuanphan BUT sadly I don't get any results. 


@media screen and (max-width:640px) {
#logoImage img {
    max-width: 300px !important;
}}

I do get some action if I change 'max-width' to 'min-width' but this does not maintain ration.

Any help would be ever so appreciated. Thanks, Alex  

Difficult to help without checking site url

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
3 hours ago, AlexCP said:

Hi @tuanphan, thanks very much for the swift reply and sorry I was unable to share the site URL.

Please find details below:

URL - https://materialworldfoundation.squarespace.com/
PW - MWL

Any help to get the logo bigger on mobile would be ever so appreciated and would certainly make my day : )

Incorrect password

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

Add to Home > Design > Custom CSS

@media screen and (max-width:640px) {
h1#logoImage img {
    max-height: 200px !important;
    max-width: 300px !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
2 minutes ago, AlexCP said:

Hi @tuanphan, you are a super star. Thanks ever so much for the swift assistance. Really very much appreciated. Thanks and enjoy the rest of your day, Alex

Yeah. Good night 😅

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
  • 2 months later...
On 2/23/2020 at 4:26 AM, tuanphan said:

Difficult to help without checking site url

https://hulseygardens.squarespace.com/

Password: 1234

Hi Tuanphan, Thanks so much for all your help in this community. I am having the same issue and would greatly appreciate for you to take a look at my mobile logo image size and advise what CSS code to use to increase the size f this logo on mobile/tablet view. Thanks again in advance. 

Screen Shot 2020-04-25 at 12.34.02 PM.png

Link to comment
On 4/26/2020 at 12:34 AM, CarolynSmith said:

https://hulseygardens.squarespace.com/

Password: 1234

Hi Tuanphan, Thanks so much for all your help in this community. I am having the same issue and would greatly appreciate for you to take a look at my mobile logo image size and advise what CSS code to use to increase the size f this logo on mobile/tablet view. Thanks again in advance. 

 

Add to Home > Design > Custom CSS

@media screen and (max-width:767px) {
.header-title-logo img {
    max-height: 100px;
}
}

 

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.