Making header logo responsive.

So, I uploaded a custom logo and I can't seem to  make it responsive. If I re-size my browser the logo does not re-size. It's the same if I try it on a cell phone. The logo stays very large and bleeds over.  

I added, 
.site-logo img {
    width: 100% !important; 
 to the custom css and it did not seem to fix my problem. This was recommended on the forum here and did not fix the issue. 

my website is and the logo that wont re-size is at the top of the page. If you shrink the browser you can see for yourself. This has been bothering me for awhile now and would love to get this fixed. 



  • .site-logo img {
        max-width: 100% !important; 

    use the above rule instead
  • Hi

    Thanks for contacting us .  

    TO make logo responsive add the below css code into 
    Appearance << Customize << header setting << custom css 

    h1.qua-logo img {
        width: 100%;

    Hope it works for you , should you need further assistance .

    Let me know .

  • We have not added any .site-logo class so try the @akhilesh suggestion
  • edited December 2015

    You are the man!! Your suggestion worked perfectly! Thanks for your help!! 

    Again, Thank you both for your fast responses. I am extremely impressed with your customer service. Keep up the good work!
  • Hi

    Thanks for kind words . 

    Look forward to see you again at Webriti . 

    Happy to help!
  • Hi there!

    Thank you for choosing Webriti

    How you like this theme. If you are comfortable with this theme and support,
     than, kindly rate this theme and our support  on this link

    .Your feedback is valuable to us and helps us improve. Please spare a minute to give your valuable feedback.

    Thank you, and we look forward to see you again at Webriti.

    Best wishes,
    Webriti Team

This discussion has been closed.