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
Post a Comment