Docs

[bletek]

Guys,
Under tight deadline and the logo on the menu bar is going wonky on the different breakpoints for mobile and tablet.

What are the breakpoints for the following

mobile portrait
mobile landscape
tablet portrait
tablet landscape

I need to get the logo and menu looking right on those breakpoints.
Looks great on mobile portrait, but if I turn the phone landscape (wide) its super small and way up in the top left.
same for tablet.

Thanks for all your help. Would play with it but deadline is tight.

R

[Lely]

Hello There,

Thanks for posting in.
Please check this thread for the default breakpoints:https://community.theme.co/forums/topic/media-query-breakpoints/

For tablets, we can use the following:

/* Landscape */
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (orientation: landscape) 
  and (-webkit-min-device-pixel-ratio: 1) {
  /*Add CSS  for Landscape tablet*/
}
/* Portrait */
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (orientation: portrait) 
  and (-webkit-min-device-pixel-ratio: 1) {
 /*Add CSS  for Portrait tablet*/
}

Hope this helps.

[Author]

Posts