Custom CSS for mobile theme

  • Unknown's avatar

    Hello, I’ve used custom CSS for my theme (using Sela) and everything is okay except for the mobile theme! I want to adjust the header as it’s too big for mobile but I can’t seem to get any use out of the .mobile-theme? Does anyone know how to trigger CSS just for mobile or it just won’t work? :/

    The blog I need help with is: (visible only to logged in users)

  • There isn’t a separate mobile theme on your site — but Sela is responsive and uses media queries to target screens of different sizes and make adjustments based on screen size. You can learn a bit how media queries work here:

    https://en.support.wordpress.com/custom-design/custom-css-media-queries/

    I’m curious whether you’ve tried using a site logo instead of a custom header? The site logo scales to different screen sizes automatically, so you wouldn’t need to add custom CSS to resize your custom header at different screen sizes. You might give it a try first to see if works for you, under Customize > Site Identity. If it doesn’t work well, then we can assist with some media queries, if you need a hand.

  • Unknown's avatar

    Thank you so much! I haven’t learned about media queries before but this solved my problem!

  • Great, glad you’re sorted!

    I’ll mark this thread as resolved but feel free to start a new one if you need help with anything else.

  • The topic ‘Custom CSS for mobile theme’ is closed to new replies.