Making Logo Appear Bigger

• 

  itstinarenee · Member · Sep 18, 2017 at 3:34 pm

  • Copy link
  • Add topic to favorites

  Hello,
  I need help making my logo bigger. The image itself is very big but when I upload it, it comes up very small. I read all other threads on this topic and have tried out a few CSS options I saw but none were working for me. If anyone can help that would be great. I’m not the most savvy person when it come to CSS.

  My website is- http://www.brooklynpetals.com and I am using the Veni theme from WordPress.

  Thank you.

  The blog I need help with is: (visible only to logged in users)

• 

  keegansingh · Member · Sep 18, 2017 at 3:44 pm

  • Copy link

  Could you please try addin this to your css:

  header.site-header .custom-logo, header.site-header .retina-logo {
  max-width: 400px;
  }

  Please let me know if that worked, it worked on my end.

• 

  itstinarenee · Member · Sep 18, 2017 at 3:45 pm

  • Copy link

  You’re amazing! It did work, thank you so much!

• 

  itstinarenee · Member · Sep 18, 2017 at 3:51 pm

  • Copy link

  Is there a way for me to change the sizing on a mobile? It comes up perfect on desktop but on my mobile it is too big…. if that makes sense…

• 

  jjchrisdiehl · Member · Sep 18, 2017 at 3:52 pm

  • Copy link

  Hi there

  I’ve tested out the theme you’re using and the only solution I’ve found is to add the following css:

  header.site-header .custom-logo, header.site-header .retina-logo{
  max-width: 15rem;
  }

  Now, at different device sizes this approach may make your logo too big, I recommend playing with media queries to find the right combination. Media queries will change that max-width value depending on the device size like so:

  @media (max-width: 900px){
  header.site-header .custom-logo, header.site-header .retina-logo{
  max-width: 70%;
  }
  }

  What this code does is change the max-width to 70% for devices below 900px in width.

  See if you can come up with the right solution for your purposes, and if you run into trouble, message us back on this thread!

• 

  jjchrisdiehl · Member · Sep 18, 2017 at 3:53 pm

  • Copy link

  Oops, small edit, make the first instance of max-width 30%, or any % you wish. Really any unit works either em, px, rem, or %, just try to stay consistent in the media query as well.

• 

  itstinarenee · Member · Sep 18, 2017 at 4:00 pm

  • Copy link

  Thank you jjchrisdiehl, that worked as well! I really appreciate the help :)