You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
I am trying to use UnCSS to generate mobile version CSS for a page. How could I achieve this?
I tried setting the userAgent to "mobile" or "Android" or "iPhone" or other strings from mobile devices, also tried setting with the "media" options with value such as "(max-width: 767px)" etc, but the results I got are always the same as the desktop version CSS.
Could you please give some hints or directions on how to achieve this?
Thanks,
Abe
The text was updated successfully, but these errors were encountered:
If you want to generate separate CSS files for desktop and mobile without using media queries, you can use different tools or methodologies. Here are a few approaches:
Use Separate Stylesheets:
Create two separate CSS files, one for desktop styles and one for mobile styles. Link the appropriate stylesheet in your HTML based on the user's device or other conditions.
This script dynamically adds a link to the appropriate stylesheet based on the viewport width.
Server-Side Detection:
Use server-side logic to determine the user's device or other conditions and serve the appropriate CSS file accordingly. This might involve user agent detection on the server side.
The specific implementation would depend on your server-side technology (Node.js, PHP, Python, etc.).
These approaches allow you to serve different CSS files based on specific conditions without relying on media queries in the CSS itself. Keep in mind that user agent detection has its limitations and may not always accurately reflect the user's device characteristics.
Hi, team,
I am trying to use UnCSS to generate mobile version CSS for a page. How could I achieve this?
I tried setting the userAgent to "mobile" or "Android" or "iPhone" or other strings from mobile devices, also tried setting with the "media" options with value such as "(max-width: 767px)" etc, but the results I got are always the same as the desktop version CSS.
Could you please give some hints or directions on how to achieve this?
Thanks,
Abe
The text was updated successfully, but these errors were encountered: