css - How can I align my logo and menu icon on a mobile device -


i using wordpress , have responsive theme using well. when view website on mobile device, menu turns icon 3 horizontal lines; slide out menu.

on mobile device menu above 3 lines towards left instead of them aligning with each other.

this code menu icon:

.section-navi .pl-nav > li > {     line-height: 50px;     padding: 0 13px;     /* opacity: .7; */ } 

and code logo:

.section-navi .navi-container {     height: 36px;     padding: 7px; } 

please visit: surveillanceshack.com , view on mobile device.

try adding following code:

you might pick suiting @media query here, if you're targeting iphones.

almost every phone starts @ min-device-width: 320px, it's decide want top limit.

// iphone 5 & 5s in portrait & landscape     @media screen , (min-device-width: 320px) , (max-device-width: 568px) {    .section-navi .navi-container {      min-height: 50px;      padding-right: 0;      box-sizing: border-box;      text-align: left;    }  }


Comments

Popular posts from this blog

qt - Using float or double for own QML classes -

Create Outlook appointment via C# .Net -

ios - Swift Array Resetting Itself -