Higher and larger logo - CSS code

[webSF]

Hello,

I use X in the “agency” variant.

How can I increase the length and width of the logo by 30% only on mobile devices?

On desktop devices it’s fine

Thanks in advance

Regards

[nabeel]

Hi @webSF,

Thank you for reaching out to us. You can do this with CSS media query. Try adding the following code in the Theme Options > CSS:

@media screen and (max-width: 767px) {
  .x-brand img {
    width: 320px;
  }
}

Feel free to adjust the width as per your need. Here are some related links for further reading, this could help you in finding and implementing some CSS fixes:

• Intro to CSS - https://goo.gl/mFuWQT
• How to get CSS selectors - https://goo.gl/BmoH39
• Get Started With Viewing And Changing CSS - https://goo.gl/7xFhDa
• CSS Media Queries - https://goo.gl/L3ZHNg

Hope this helps!