Check this JS Fiddle: http://jsfiddle.net/pizzaboy13/u7FL5/
How to Target Internet Explorer 10 and 11 in CSS
Logic taken from here: https://philipnewcomer.net/2014/04/target-internet-explorer-10-11-css/ -ms-high-contrast supports two values: none and active. So to target IE10+ regardless of the property’s setting, use this media query:
Add a browser css selector to your html tag
See this great tool: https://github.com/crucifyer/css-browser-selector Demo page here: http://crucifyer.github.io/css-browser-selector/
Internet Explorer – Version specific css rules
Amazing article published here originally: http://keithclark.co.uk/articles/moving-ie-specific-css-into-media-blocks/media-tests/ Exclusively targeting IE browsers Style rules defined in the following blocks will only be applied in IE, other browsers will ignore them. Rule IE 6 IE 7 IE 8 IE 9 IE 10 @media screen\0 {…} No No Yes Yes Yes @media screen\9 {…} Yes Yes No No No @media Full Article…
Fix grey google maps
I found this issue with the Manutec store finder. This css fixed the issue returning maps back to their normal display.
Ordered List CSS Styles
Original here: http://codeitdown.com/ordered-list-css-styles/ Styling ordered list numbers with CSS is not as simple as one might think because there is no CSS selector to target list numbers. Styling them is only possible with a simple CSS3 technique that uses a counter to replace the default numbers. Styled numbers will only be visible in CSS3 browsers , Full Article…
z-index & fixed position
A great article/blog post: http://www.fiveminuteargument.com/fixed-position-z-index The two fixed-position divs on this page are marked up as: and styled thus: Note that the lower, orange element has a z-index specified, whilst the first element doesn’t. The ul just below this text has a relative position. When the page is scrolled, and the orange div overlaps that list, all looks fine. When the green div overlaps Full Article…
Vertically align text in a div
This is loosely taken from this page: Here is the html structure: Here’s the css: Must have a height, be set to be a table and have the vertical-align set.
Responsive WordPress Images
WordPress has a few default classes used for things like image alignment, galleries and other html output by core features. This is a combination of the styles found in the default WordPress TwentyEleven theme, and some modifications of my own. Include this snippet with your css to save a bunch of time building your responsive Full Article…