<?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>Techie-Gyan &#187; css</title>
	<atom:link href="http://www.techiegyan.com/category/css/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.techiegyan.com</link>
	<description></description>
	<lastBuildDate>Fri, 25 Nov 2011 05:37:37 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.3.1</generator>
		<item>
		<title>HTML 5 and CSS 3</title>
		<link>http://www.techiegyan.com/2010/06/03/html-5-and-css-3/</link>
		<comments>http://www.techiegyan.com/2010/06/03/html-5-and-css-3/#comments</comments>
		<pubDate>Thu, 03 Jun 2010 09:42:35 +0000</pubDate>
		<dc:creator>Aditya</dc:creator>
				<category><![CDATA[API]]></category>
		<category><![CDATA[coding]]></category>
		<category><![CDATA[css]]></category>
		<category><![CDATA[html]]></category>
		<category><![CDATA[web]]></category>
		<category><![CDATA[website]]></category>

		<guid isPermaLink="false">http://www.techiegyan.com/?p=1392</guid>
		<description><![CDATA[Up to Speed on HTML 5 and CSS 3 View more presentations from M. Jackson Wilkinson.]]></description>
			<content:encoded><![CDATA[<div style="width:425px" id="__ss_1739893"><strong style="display:block;margin:12px 0 4px"><a href="http://www.slideshare.net/whafro/up-to-speed-on-html-5-and-css-3" title="Up to Speed on HTML 5 and CSS 3">Up to Speed on HTML 5 and CSS 3</a></strong><object id="__sse1739893" width="425" height="355"><param name="movie" value="http://static.slidesharecdn.com/swf/ssplayer2.swf?doc=refreshdc-html5css3-090719085307-phpapp01&#038;stripped_title=up-to-speed-on-html-5-and-css-3" /><param name="allowFullScreen" value="true"/><param name="allowScriptAccess" value="always"/><embed name="__sse1739893" src="http://static.slidesharecdn.com/swf/ssplayer2.swf?doc=refreshdc-html5css3-090719085307-phpapp01&#038;stripped_title=up-to-speed-on-html-5-and-css-3" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="425" height="355"></embed></object>
<div style="padding:5px 0 12px">View more <a href="http://www.slideshare.net/">presentations</a> from <a href="http://www.slideshare.net/whafro">M. Jackson Wilkinson</a>.</div>
</div>
]]></content:encoded>
			<wfw:commentRss>http://www.techiegyan.com/2010/06/03/html-5-and-css-3/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Applying Styles to Check Boxes / Radio Buttons &#8211; Jquery Plugin</title>
		<link>http://www.techiegyan.com/2009/10/07/applying-styles-to-check-boxes-radio-buttons-jquery-plugin/</link>
		<comments>http://www.techiegyan.com/2009/10/07/applying-styles-to-check-boxes-radio-buttons-jquery-plugin/#comments</comments>
		<pubDate>Wed, 07 Oct 2009 16:50:59 +0000</pubDate>
		<dc:creator>Aditya</dc:creator>
				<category><![CDATA[addon]]></category>
		<category><![CDATA[coding]]></category>
		<category><![CDATA[css]]></category>
		<category><![CDATA[html]]></category>
		<category><![CDATA[javascript]]></category>
		<category><![CDATA[jquery]]></category>
		<category><![CDATA[web]]></category>

		<guid isPermaLink="false">http://www.techiegyan.com/?p=923</guid>
		<description><![CDATA[Check boxes and radio buttons are INPUT elements of HTML which lets us choose the options. Check boxes are used for choosing some of the options or enabling/disabling some value. Radio buttons are generally used for choosing one of the various options. Both have minimal UI and supporting messages are generally displayed to describe the [...]]]></description>
			<content:encoded><![CDATA[<p>Check boxes and radio buttons are INPUT elements of HTML which lets us choose the options. Check boxes are used for choosing some of the options or enabling/disabling some value. Radio buttons are generally used for choosing one of the various options. </p>
<p>Both have minimal UI and supporting messages are generally displayed to describe the input. Radio buttons are used in the group i.e. if one of them is checked, rest will be unchecked automatically.</p>
<p>I found this jquery plugin which apply styles to Check boxes and Radio buttons for presenting better interface. I liked it because it makes the selected choice more clear to the user. You can find this plug-in at <a href="http://widowmaker.kiev.ua/checkbox/">http://widowmaker.kiev.ua/checkbox/</a>. Project is also hosted at google code so you can also check <a href="http://code.google.com/p/jquery-checkbox/">http://code.google.com/p/jquery-checkbox/</a></p>
<p><iframe frameborder="0" src ="http://www.techiegyan.com/examples/jquerycheckbox/index.html" width="520" height="350"></iframe></p>
<p>Some of the features:</p>
<p>1. Only inline elements used, just like default checkoxes<br />
2. Cross-browser look and feel (tested in IE6, IE7, IE8, Firefox and Chrome engines)<br />
3. Work with radio buttons too<br />
4. Supports inline and jQuery attached click events<br />
5. Dynamic skin changing<br />
6. Adds new checkbox events &#8220;check&#8221;, &#8220;uncheck&#8221;, &#8220;disable&#8221;, &#8220;enable&#8221;, ready to use in jQuery.bind() method</p>
<p>And of course there is a dependency of Jquery javascript library(1.3.2 recommended) . </p>
<p>Now here is the code using which above check boxes and Radio buttons are transformed. </p>
<pre class="javascript">&nbsp;
$<span style="color: #66cc66;">&#40;</span>document<span style="color: #66cc66;">&#41;</span>.<span style="color: #006600;">ready</span><span style="color: #66cc66;">&#40;</span><span style="color: #003366; font-weight: bold;">function</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span> <span style="color: #66cc66;">&#123;</span>
	$<span style="color: #66cc66;">&#40;</span><span style="color: #3366CC;">'input:checkbox'</span><span style="color: #66cc66;">&#41;</span>.<span style="color: #006600;">checkbox</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
	$<span style="color: #66cc66;">&#40;</span><span style="color: #3366CC;">'input:radio'</span><span style="color: #66cc66;">&#41;</span>.<span style="color: #006600;">checkbox</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>;
<span style="color: #66cc66;">&#125;</span><span style="color: #66cc66;">&#41;</span>;
&nbsp;
&nbsp;</pre>
<p>Above code will add style to all the check box and radio inputs present in document.  </p>
]]></content:encoded>
			<wfw:commentRss>http://www.techiegyan.com/2009/10/07/applying-styles-to-check-boxes-radio-buttons-jquery-plugin/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Firefox 3.5 Overview</title>
		<link>http://www.techiegyan.com/2009/08/11/firefox-35-overview/</link>
		<comments>http://www.techiegyan.com/2009/08/11/firefox-35-overview/#comments</comments>
		<pubDate>Tue, 11 Aug 2009 11:56:31 +0000</pubDate>
		<dc:creator>Aditya</dc:creator>
				<category><![CDATA[css]]></category>
		<category><![CDATA[internet]]></category>
		<category><![CDATA[javascript]]></category>
		<category><![CDATA[web]]></category>
		<category><![CDATA[website]]></category>

		<guid isPermaLink="false">http://www.techiegyan.com/?p=863</guid>
		<description><![CDATA[Firefox 3.5 Overview View more documents from Chengings.]]></description>
			<content:encoded><![CDATA[<div style="width:425px;text-align:left" id="__ss_1484915"><a style="font:14px Helvetica,Arial,Sans-serif;display:block;margin:12px 0 3px 0;text-decoration:underline;" href="http://www.slideshare.net/Chengings/firefox-35-overview" title="Firefox 3.5 Overview">Firefox 3.5 Overview</a><object style="margin:0px" width="425" height="355"><param name="movie" value="http://static.slidesharecdn.com/swf/ssplayer2.swf?doc=firefox3-5-090525062640-phpapp02&#038;stripped_title=firefox-35-overview" /><param name="allowFullScreen" value="true"/><param name="allowScriptAccess" value="always"/><embed src="http://static.slidesharecdn.com/swf/ssplayer2.swf?doc=firefox3-5-090525062640-phpapp02&#038;stripped_title=firefox-35-overview" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="425" height="355"></embed></object>
<div style="font-size:11px;font-family:tahoma,arial;height:26px;padding-top:2px;">View more <a style="text-decoration:underline;" href="http://www.slideshare.net/">documents</a> from <a style="text-decoration:underline;" href="http://www.slideshare.net/Chengings">Chengings</a>.</div>
</div>
]]></content:encoded>
			<wfw:commentRss>http://www.techiegyan.com/2009/08/11/firefox-35-overview/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Redirecting Browser Dependent Content &#8212; mod rewrite</title>
		<link>http://www.techiegyan.com/2009/07/18/redirecting-browser-dependent-content-mod-rewrite/</link>
		<comments>http://www.techiegyan.com/2009/07/18/redirecting-browser-dependent-content-mod-rewrite/#comments</comments>
		<pubDate>Sat, 18 Jul 2009 19:47:30 +0000</pubDate>
		<dc:creator>Aditya</dc:creator>
				<category><![CDATA[addon]]></category>
		<category><![CDATA[css]]></category>
		<category><![CDATA[javascript]]></category>
		<category><![CDATA[website]]></category>

		<guid isPermaLink="false">http://www.techiegyan.com/?p=806</guid>
		<description><![CDATA[You may be having some specific functionality on your website which is not working on all the browsers like IE, Firefox, Opera, Safari etc. Generally, this should be CSS or Javascript related things because of their different implementations for different browsers. Most of the new javascript libraries take care of this concern and they generally [...]]]></description>
			<content:encoded><![CDATA[<p>You may be having some specific functionality on your website which is not working on all the browsers like IE, Firefox, Opera, Safari etc. Generally, this should be CSS or Javascript related things because of their different implementations for different browsers. Most of  the new javascript libraries take care of this concern and they generally handle this with conditional implementation of logic for all popular different browsers. </p>
<p>In case you need to have different pages for different browsers, You can use a module on httpd for it i.e. mod rewrite. You can re-write the URL by checking the browser so that every browsers will be pointed to page specific to it. </p>
<p>Here is an example for how to configure it:</p>
<pre lang="">
RewriteCond %{HTTP_USER_AGENT}  Opera
RewriteRule ^index.html http://www.mywebsite.com/index-opera.html [R]
RewriteCond %{HTTP_USER_AGENT} MSIE
RewriteRule ^index.html http://www.mywebsite.com/index-IE.html [R]
RewriteCond %{HTTP_USER_AGENT} Firefox
RewriteRule ^index.html http://www.mywebsite.com/index-firefox.html [R]
</pre>
<p>Use it, in case you need different pages for different browsers and Of course you need to enable this module before using it. </p>
]]></content:encoded>
			<wfw:commentRss>http://www.techiegyan.com/2009/07/18/redirecting-browser-dependent-content-mod-rewrite/feed/</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
		<item>
		<title>CSS Cascade</title>
		<link>http://www.techiegyan.com/2009/07/15/css-cascade/</link>
		<comments>http://www.techiegyan.com/2009/07/15/css-cascade/#comments</comments>
		<pubDate>Wed, 15 Jul 2009 06:23:53 +0000</pubDate>
		<dc:creator>Aditya</dc:creator>
				<category><![CDATA[coding]]></category>
		<category><![CDATA[css]]></category>
		<category><![CDATA[web]]></category>
		<category><![CDATA[website]]></category>

		<guid isPermaLink="false">http://www.techiegyan.com/?p=804</guid>
		<description><![CDATA[CSS Cascade View more documents from Russ Weakley.]]></description>
			<content:encoded><![CDATA[<div style="width:425px;text-align:left" id="__ss_1658158"><a style="font:14px Helvetica,Arial,Sans-serif;display:block;margin:12px 0 3px 0;text-decoration:underline;" href="http://www.slideshare.net/maxdesign/css-cascade-1658158" title="CSS Cascade">CSS Cascade</a><object style="margin:0px" width="425" height="355"><param name="movie" value="http://static.slidesharecdn.com/swf/ssplayer2.swf?doc=cascade4-090629163004-phpapp01&#038;stripped_title=css-cascade-1658158" /><param name="allowFullScreen" value="true"/><param name="allowScriptAccess" value="always"/><embed src="http://static.slidesharecdn.com/swf/ssplayer2.swf?doc=cascade4-090629163004-phpapp01&#038;stripped_title=css-cascade-1658158" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="425" height="355"></embed></object>
<div style="font-size:11px;font-family:tahoma,arial;height:26px;padding-top:2px;">View more <a style="text-decoration:underline;" href="http://www.slideshare.net/">documents</a> from <a style="text-decoration:underline;" href="http://www.slideshare.net/maxdesign">Russ Weakley</a>.</div>
</div>
]]></content:encoded>
			<wfw:commentRss>http://www.techiegyan.com/2009/07/15/css-cascade/feed/</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
	</channel>
</rss>

