How to move the logo to the left on mobile/tablet view? - Support

Tagged: Responsive Menu

Viewing 7 posts - 1 through 7 (of 7 total)

Author

Posts
October 30, 2014 at 7:33 pm #343580

bakbek
Participant

Hi, as you can see here – http://screencast.com/t/HnGewhXjTwPV – the logo is showing to the right and the menu is covering it. How can I move the logo to the left so it won’t collide with the mobile/tablet menu?

Thanks.

October 30, 2014 at 7:38 pm #343585
Yigit
Keymaster
Hi DROR!

Please add following code to Quick CSS
```
#advanced_menu_toggle, #advanced_menu_hide { right: auto; left: 0; }
```
Cheers!
Yigit
October 30, 2014 at 9:33 pm #343728

bakbek
Participant

That moved the menu to the left, not the logo – http://screencast.com/t/bshQiE0MJ – which is OK but now when looking on a tablet the menu and logo collide – http://screencast.com/t/6eyd6Maj8G

October 30, 2014 at 9:34 pm #343731
Yigit
Keymaster
Hey!

My bad! Please use following code to change the position of logo on mobile
```
@media only screen and (max-width: 990px) {
.html_header_top #top .av_logo_right .logo {
left: 0;
right: auto;
}}
```
Cheers!
Yigit
October 31, 2014 at 1:49 am #343827

bakbek
Participant

Still no go.

If I use this code (without the previous code) than on smartphones the logo is again on the the right and collides with the menu – http://screencast.com/t/pvfdcaCD – while on tablet it looks OK as the logo is on the left and menu is on the right – http://screencast.com/t/EisYfSxPCkPM

If I use both of the codes than on smartphones it’s OK as the logo is on the right and menu is on the left – http://screencast.com/t/lugb9jcA5MF – but on tablets the logo is on the left and so is the menu – https://www.evernote.com/shard/s55/sh/4d7b7cee-366d-40ba-86d0-dce81ab9e197/ddad1b6bff76406469d230dee8913cc2/deep/0/–Sous-Vide—סו-ויד-ישראל—הכל-על-בישול-סו-ויד-במקום-אחד.png

How can I make the logo show on the left and the menu show on the right for all mobile devices? I think that would be the best solution.

November 2, 2014 at 2:07 pm #344848
Andy
Inactive Moderator
Hey!

replace code with:
```
@media only screen and (max-width: 990px) {
.html_header_top #top .av_logo_right .logo {
left: 0;
right: 0;
}}

@media only screen and (max-width: 767px) {
.responsive .logo {
margin-right: 120px;
}}
```
Hope that helps.

Regards,
Andy
November 2, 2014 at 2:30 pm #344850

bakbek
Participant

Thanks.
Author

Posts

Viewing 7 posts - 1 through 7 (of 7 total)

The topic ‘How to move the logo to the left on mobile/tablet view?’ is closed to new replies.