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
  • Replies 12
  • Views 2k
  • Created
  • Last Reply
  • 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

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

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

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

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

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.