CSS - Conditional comments. Page last changed today Conditional comments only work in IE, and are thus excellently suited to give special instructions meant only for IE.
They are supported from IE 5 up until IE9 (inclusive). Older IE versions frequently need some extra CSS in order to show your pages right. Conditional comments are the best way to add this CSS, since the system is explicitly designed for this use case. If you need special styles for IE10 or up you’ll have to find another method, since conditional comments were disabled in IE10. Conditional comments work as follows: <!
Their basic structure is the same as an HTML comment (<! Below I added a lot of conditional comments that print out messages according to your IE version. Note that conditional comments were removed from IE10, so IE10 and up will not understand the test. Below are a few conditional comments that reveal the IE version you're using. According to the conditional comment this is not IE 5-9 The syntax I use is: <p class="accent"><! <! This is IE. Css tips. Introduction This article includes 8 helpful solutions which we find essential when designing with CSS Browser-Specific selectors These selectors are very useful when you want to change a style in one browser but not the others.
IE 6 and below * html {} IE 7 and below *:first-child+html {} * html {} IE 7 only *:first-child+html {} IE 7 and modern browsers only html>body {} Modern browsers only (not IE 7) html>/**/body {} Recent Opera versions 9 and below html:first-child {} Safari html[xmlns*=""] body:last-child {} To use these selectors, place the code in front of the style. Source Transparent PNG’s in IE6 An IE6 bug which causes a great deal of hassle is that it doesn’t support transparent PNG images. You will need to use a filter which overrides the CSS. Removing dotted links Firefox produces a dotted outline that appears around links when you click on them. This is simple to stop. Applying a width to inline elements If you apply a width to an inline element it will only work inIE6. Min-width Source. Bitty Browser: Introduction.
Lickr: Flickr, without the Flash. This post is from the dark ages, when Flickr used Flash extensively.
Historical interest only. Flickr is a popular photo hosting service that uses embedded Flash files as part of their interface. On every page, there will be a little delay while a new Flash file loads. Lickr removes the need for Flash. It runs within the web browser Firefox, stripping the Flash before the user can even see it, and replacing it with an equivalent interface in pure HTML and Javascript. Click the buttons to see the difference (or rather, the similarities). Lickr combines Flickr, Greasemonkey, and Ajax, and is worth triple points in buzzword bingo. How to install Flickr is for Firefox only and requires that you have Greasemonkey installed. Obligatory warning: In principle, using Greasemonkey and Lickr could harm your data.
Possible breakage in the future: Lickr depends on Flickr and Greasemonkey staying more or less the same. Why? So what’s wrong with Flickr’s perfectly good Flash interface? Techniques What next?