Logo overlaps Donut theme menu - mobile

Question

When viewing my website via cell phone, my logo covers some of the menu button which makes it hard selecting the menu.  Is there a way to move the logo over slightly?  I tried playing around with logo size, but still seems to cover menu button a little.

Comments

What is the width and height of the logo image?

---

It is 460x77.  Ive tried reducing it but still seems to be to close to the menu button.

---

I was able to adjust it down to 185 width and it seems to be ok. Smaller than I would like it to be on computer, but should be ok.

Answer 1

1. Locate file qa-theme/Donut-theme/css/donut.css (or its minified version if production mode is enabled).

2. Add this:

margin-left: 10px;

After this line: https://github.com/amiyasahu/Donut/blob/23aab78a3837a29b38139af2e61e9c8f7df8c303/qa-theme/Donut-theme/css/donut.css#L380

You might need to play a bit with the number, though.

In the image below you can see in orange how it was below and in light blue how it should be after the change:

It was overlapping the menu icon a little bit.

Comments

Thank you, I will give this a try!