In Chrome DEV tools check the Content Type for the css file. If it is not text/css you may have a incomplete Nginx configuration. Check the default Nginx conf file usually in /etc/nginx has the Mimetypes listed as below in the http section: http{ include /etc/nginx/mime.types; sendfile on;} Nginx Docs https://www.nginx.com/resources/wiki/start/topics/examples/full/
Tag: CSS
Vertical and Horizontal Centered Webpage.
A way to vertically center content on a webpage using the css table property. html { height: 100%; } body { display: table; width: 100%; height: 100%; } #childtobody { display: table-cell; vertical-align: middle; text-align: center; }
IE7 Input Button Width Issue
IE7 and IE6 will by default add padding to input button object depending on width, to remove the extra padding, add the following css to your input object: overflow: visible;
IE7 z-index issues
If you have z-index issues, particularly with drop down menus in IE7 this conditional script may help. <!–[if IE 7]> <script type=”text/javascript”> $(document).ready(function(){ $(function() { var zIndexNumber = 1000; $(‘div’).each(function() { $(this).css(‘zIndex’, zIndexNumber); zIndexNumber -= 10; }); }); }) </script> <![endif]–>
Conditional CSS for Internet Explorer
To add stylesheets for specfic Internet Explorer versions you can add the blocks of code below to the head section of your HTML code. Make sure the code is placed beneath your main css declarations. All IE Versions <!–[if IE]> <link rel=”stylesheet” type=”text/css” href=”ie-all.css” /> <![endif]–> IE6 <!–[if IE 6]> <link rel=”stylesheet” type=”text/css” href=”ie6.css” /> […]
Stop iPad and iOS devices formatting numbers on webpage
An iOS will automatically see some numbers as telephone numbers and will format the number bypassing any css styling your website might have. You can stop this by altering the Apple specific meta tags. Place the code below in the head section of your webpage. <meta name=”format-detection” content=”telephone=no”>
Remove iOS styling on input boxes
By default html input boxes will have a inner shadow style applied on iPad and other iOS devices. You can remove this styling by adding the following css code to a html input object. -webkit-appearance:none;