Next.js Global CSS cannot be imported from files other than your Custom

Use the built-in Next.js CSS loader (see here) instead of legacy @zeit/next-sass. Replace @zeit/next-sass package with sass. Remove next.config.js. Or do not change CSS loading in it. Move the global CSS as suggested in the error message. Since Next.js 9.2 global CSS must be imported in Custom <App> component. // pages/_app.js import ‘../global-styles/main.scss’ export default … Read more

How to preserve line breaks in block?

Are you sure you’re not doing something wrong? This code works for me on IE7: <!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN” “”> <html> <head> <style type=”text/css”> code { white-space: pre; } </style> </head> <body> <code> function() { alert(‘yay’); } </code> </body> </html>

Wonky text anti-aliasing when rotating with webkit-transform in Chrome

Try triggering the CSS 3d Transform mode with webkit. this changes the way chrome renders -webkit-transform: rotate(.7deg) translate3d( 0, 0, 0); edit There also a Webkit only style declaration -webkit-font-smoothing which takes the values none subpixel-antialiased antialiased where subpixel-antialiased is the default value. Alas, the subpixel antialias is no good solution for rotated text. The … Read more

CSS – Font being blocked from Cross-Origin Resource Sharing Policy

If you don’t have mod_headers enabled you can enabled it with sudo a2enmod headers And then in your VirtualHost or .htaccess # Allow access from all domains for webfonts. # Alternatively you could only whitelist your # subdomains like “”. <IfModule mod_headers.c> <FilesMatch “\.(ttf|ttc|otf|eot|woff|font.css|css|woff2)$”> Header set Access-Control-Allow-Origin “*” </FilesMatch> </IfModule>