Custom CSS not working when in Mobile browser
-
Hi. I have put in some custom css. In a regular browser size the CSS styles works perfectly fine until I make the browser smaller. Here is the example of the issue. Thanks.
-
Hey!
On that website I see "@media only screen and (max-device-width: 480px) {}" as a text on the site. You should probably put <style></style> tags around that css if you want that to work.Now to your question:
In "Lay Options" -> "Custom CSS & HTML" there are two CSS fields:
"Custom CSS for desktop" and "Custom CSS for mobile". If you want some css to apply to both mobile and desktop you need to put your css into the two fields.Maybe it's easier if you just put a style tag into the field "Custom <head> content" (which is below "Custom CSS for Mobile Version"):
<style> /*your styles for mobile and desktop here*/ </style>
I also code custom websites or custom Lay features.
šæ Email me here: šæ
info@laytheme.com
Before you post:
- When using a WordPress Cache plugin, disable it or clear your cache.
- Update Lay Theme and all Lay Theme Addons
- Disable all Plugins
- Go to Lay Options ā Custom CSS & HTML, click "Turn Off All Custom Code", click "Save Changes"
This often solves issues you might run into
When you post:
- Post a link to where the problem is
- Does the problem happen on Chrome, Firefox, Safari or iPhone or Android?
- If the problem is difficult to explain, post screenshots / link to a video to explain it