<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Kurinchi Blogger Scribbles ... &#187; FIR</title>
	<atom:link href="http://kurinchilamp.kurinchilion.com/tag/fir/feed" rel="self" type="application/rss+xml" />
	<link>http://kurinchilamp.kurinchilion.com</link>
	<description>On Open Source Technologies</description>
	<lastBuildDate>Mon, 02 Jan 2012 06:14:45 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.3</generator>
		<item>
		<title>CSS FIR Technique explained</title>
		<link>http://kurinchilamp.kurinchilion.com/2009/05/css-fir-explained.html</link>
		<comments>http://kurinchilamp.kurinchilion.com/2009/05/css-fir-explained.html#comments</comments>
		<pubDate>Fri, 22 May 2009 00:48:24 +0000</pubDate>
		<dc:creator>kurinchilamp</dc:creator>
				<category><![CDATA[UI, CSS]]></category>
		<category><![CDATA[CSS]]></category>
		<category><![CDATA[Fahrner Image Replacement]]></category>
		<category><![CDATA[FIR]]></category>
		<category><![CDATA[quirksmode]]></category>
		<category><![CDATA[sIFR]]></category>

		<guid isPermaLink="false">http://kurinchilamp.kurinchilion.com/?p=355</guid>
		<description><![CDATA[FIR stands for Fahrner Image Replacement named after Todd Fahrner. It is a standard compliant technique in which &#60;h1&#62; and &#60;span&#62; tags are used to have nice headings and highlights. Key fact in this technique is that the text will get displayed even if the CSS is disabled for some reason, hence presenting the text [...]]]></description>
			<content:encoded><![CDATA[<p><strong>FIR </strong>stands for <strong>Fahrner Image Replacement </strong>named after <em>Todd Fahrner</em>.</p>
<p>It is a standard compliant technique in which &lt;h1&gt; and &lt;span&gt; tags are used to have nice headings and highlights.</p>
<p>Key fact in this technique is that the text will get displayed even if the CSS is disabled for some reason, hence presenting the text beneath it.<br />
<span id="more-355"></span></p>
<p><strong>Sample CSS in HTML context</strong></p>
<pre class="brush: php">
&lt;h1 id="myheading"&gt;
	&lt;span id="mytext"&gt;Kurinchi Blogger&lt;/span&gt;
&lt;/h1&gt;
</pre>
<p><strong>CSS Definition</strong></p>
<pre class="brush: php">
myheading{background: transparent url(images/logo.gif) no-repeat scroll left top; display:block; float: left; width: 200px; height: 65px;}
#myheading #mytext{display: none;}
</pre>
<p>To test various possibilities in Firefox browser &#8230;</p>
<p>1) <strong>Disable CSS, Enable Images: View &gt; Page style &gt; No style</strong><br />
Now check the page where FIR is applied by refreshing the page.</p>
<p>2) <strong>Enable CSS, Disable Images: Tools &gt; options &gt; content &gt; UNCHECK &#8220;Load images automatically&#8221;</strong><br />
Now check the page where FIR is applied by refreshing the page and the text will not get displayed in this case.</p>
<p>Check <a href="http://www.csszengarden.com/">Zen Garden </a>website to see how FIR is used.</p>
<p><strong>FIR </strong>behaved indifferently when in quirksmode and rendered ineffective in screen readers which brought in questions about the usage of this technique.</p>
<p><strong>sFIR </strong>technique supersedes FIR technique with its Flash replacement on text rendering styled texts.</p>
]]></content:encoded>
			<wfw:commentRss>http://kurinchilamp.kurinchilion.com/2009/05/css-fir-explained.html/feed</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
	</channel>
</rss>

