<?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/"
	xmlns:georss="http://www.georss.org/georss" xmlns:geo="http://www.w3.org/2003/01/geo/wgs84_pos#" xmlns:media="http://search.yahoo.com/mrss/"
	>

<channel>
	<title>CSS Circle &#187; CSS</title>
	<atom:link href="http://csscircle.wordpress.com/tag/css/feed/" rel="self" type="application/rss+xml" />
	<link>http://csscircle.wordpress.com</link>
	<description>4 easy and better web</description>
	<lastBuildDate>Sat, 07 Nov 2009 09:05:51 +0000</lastBuildDate>
	<generator>http://wordpress.com/</generator>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<cloud domain='csscircle.wordpress.com' port='80' path='/?rsscloud=notify' registerProcedure='' protocol='http-post' />
<image>
		<url>http://www.gravatar.com/blavatar/65b3775d6d5c0f65599891a1d5330c83?s=96&#038;d=http://s.wordpress.com/i/buttonw-com.png</url>
		<title>CSS Circle &#187; CSS</title>
		<link>http://csscircle.wordpress.com</link>
	</image>
	<atom:link rel="search" type="application/opensearchdescription+xml" href="http://csscircle.wordpress.com/osd.xml" title="CSS Circle" />
		<item>
		<title>May 12th/ Top reasons your CSS columns are messed up</title>
		<link>http://csscircle.wordpress.com/2008/12/10/may-12th-top-reasons-your-css-columns-are-messed-up/</link>
		<comments>http://csscircle.wordpress.com/2008/12/10/may-12th-top-reasons-your-css-columns-are-messed-up/#comments</comments>
		<pubDate>Wed, 10 Dec 2008 13:25:40 +0000</pubDate>
		<dc:creator>siddesigner</dc:creator>
				<category><![CDATA[Uncategorized]]></category>
		<category><![CDATA[CSS]]></category>
		<category><![CDATA[css advanced list]]></category>
		<category><![CDATA[css tips]]></category>
		<category><![CDATA[css tricks]]></category>
		<category><![CDATA[IE bugs]]></category>
		<category><![CDATA[ie fix]]></category>
		<category><![CDATA[web design]]></category>

		<guid isPermaLink="false">http://csscircle.wordpress.com/?p=74</guid>
		<description><![CDATA[

I believe the recent surge in popularity of CSS frameworks comes from a lack of basic understanding of the CSS box model and how it’s implemented across browsers. I wanted to share with you some quick tips on how to avoid easy pitfalls so you can create your own CSS framework in no time flat, [...]<img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=csscircle.wordpress.com&blog=4330425&post=74&subd=csscircle&ref=&feed=1" />]]></description>
		<wfw:commentRss>http://csscircle.wordpress.com/2008/12/10/may-12th-top-reasons-your-css-columns-are-messed-up/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
	
		<media:content url="http://1.gravatar.com/avatar/9762354ed8cd3d054cc0b34675c4f34e?s=96&#38;d=identicon&#38;r=G" medium="image">
			<media:title type="html">siddesigner</media:title>
		</media:content>

		<media:content url="http://warpspire.com/images/posts/css-column-tricks/ie6doublefloat.gif" medium="image" />

		<media:content url="http://warpspire.com/images/posts/css-column-tricks/extendingcolumns.gif" medium="image" />

		<media:content url="http://warpspire.com/images/posts/css-column-tricks/negativemargin.gif" medium="image" />
	</item>
		<item>
		<title>Cross Browser Compatibility</title>
		<link>http://csscircle.wordpress.com/2008/10/25/cross-browser-compatibility/</link>
		<comments>http://csscircle.wordpress.com/2008/10/25/cross-browser-compatibility/#comments</comments>
		<pubDate>Sat, 25 Oct 2008 08:50:10 +0000</pubDate>
		<dc:creator>siddesigner</dc:creator>
				<category><![CDATA[CSS]]></category>
		<category><![CDATA[Cross Browser Compatibility]]></category>

		<guid isPermaLink="false">http://csscircle.wordpress.com/?p=64</guid>
		<description><![CDATA[There are literally hundreds of web browsers in use around the world. All of them implement the W3C document standards a little differently. Web designers must wrestle with these differences to make a web site work. This article discusses the effect those different implementations has on design.
 What is Cross Browser Compatibility? 
If a web [...]<img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=csscircle.wordpress.com&blog=4330425&post=64&subd=csscircle&ref=&feed=1" />]]></description>
		<wfw:commentRss>http://csscircle.wordpress.com/2008/10/25/cross-browser-compatibility/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
	
		<media:content url="http://1.gravatar.com/avatar/9762354ed8cd3d054cc0b34675c4f34e?s=96&#38;d=identicon&#38;r=G" medium="image">
			<media:title type="html">siddesigner</media:title>
		</media:content>
	</item>
		<item>
		<title>How to add a Favicon to your Website/Blog</title>
		<link>http://csscircle.wordpress.com/2008/10/25/how-to-add-a-favicon-to-your-websiteblog/</link>
		<comments>http://csscircle.wordpress.com/2008/10/25/how-to-add-a-favicon-to-your-websiteblog/#comments</comments>
		<pubDate>Sat, 25 Oct 2008 08:47:15 +0000</pubDate>
		<dc:creator>siddesigner</dc:creator>
				<category><![CDATA[CSS]]></category>
		<category><![CDATA[css tips]]></category>
		<category><![CDATA[css tricks]]></category>

		<guid isPermaLink="false">http://csscircle.wordpress.com/?p=57</guid>
		<description><![CDATA[
If you have Photoshop knowledge, you can make your own icon image. Start with a 64&#215;64 image and after you&#8217;ve finished your creation, resize it down to 16&#215;16 and save it as .ico file. If you do not have the icon file format in Photoshop, you can download it here.
Download Photoshop .ico file format. Right-click [...]<img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=csscircle.wordpress.com&blog=4330425&post=57&subd=csscircle&ref=&feed=1" />]]></description>
		<wfw:commentRss>http://csscircle.wordpress.com/2008/10/25/how-to-add-a-favicon-to-your-websiteblog/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
	
		<media:content url="http://1.gravatar.com/avatar/9762354ed8cd3d054cc0b34675c4f34e?s=96&#38;d=identicon&#38;r=G" medium="image">
			<media:title type="html">siddesigner</media:title>
		</media:content>

		<media:content url="http://www.webdesign.org/img_articles/10135/xmas_tree.gif" medium="image" />

		<media:content url="http://www.webdesign.org/img_articles/10135/xmas_stocking.gif" medium="image" />

		<media:content url="http://www.webdesign.org/img_articles/10135/xmas_gift.gif" medium="image" />

		<media:content url="http://www.webdesign.org/img_articles/10135/Xmas_bow.gif" medium="image" />

		<media:content url="http://www.webdesign.org/img_articles/10135/xmas_ball.gif" medium="image" />

		<media:content url="http://www.webdesign.org/img_articles/10135/Xmas-leaf.gif" medium="image" />

		<media:content url="http://www.webdesign.org/img_articles/10135/rudolph2.gif" medium="image" />

		<media:content url="http://www.webdesign.org/img_articles/10135/candy.gif" medium="image" />
	</item>
		<item>
		<title>Horizontal And Vertical Centering</title>
		<link>http://csscircle.wordpress.com/2008/10/25/horizontal-and-vertical-centering/</link>
		<comments>http://csscircle.wordpress.com/2008/10/25/horizontal-and-vertical-centering/#comments</comments>
		<pubDate>Sat, 25 Oct 2008 08:45:54 +0000</pubDate>
		<dc:creator>siddesigner</dc:creator>
				<category><![CDATA[CSS]]></category>
		<category><![CDATA[css tips]]></category>
		<category><![CDATA[css tricks]]></category>
		<category><![CDATA[Horizontal And Vertical Centering]]></category>

		<guid isPermaLink="false">http://csscircle.wordpress.com/?p=60</guid>
		<description><![CDATA[I know many people have wondered how to center their content both horizontally and vertically but never managed to find a solution on how to do this using CSS. I have seen people use tables to accomplish this, in this tutorial I will show you how it can be done.
We start off by using an [...]<img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=csscircle.wordpress.com&blog=4330425&post=60&subd=csscircle&ref=&feed=1" />]]></description>
		<wfw:commentRss>http://csscircle.wordpress.com/2008/10/25/horizontal-and-vertical-centering/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
	
		<media:content url="http://1.gravatar.com/avatar/9762354ed8cd3d054cc0b34675c4f34e?s=96&#38;d=identicon&#38;r=G" medium="image">
			<media:title type="html">siddesigner</media:title>
		</media:content>
	</item>
		<item>
		<title>From Photoshop to XHTML and CSS</title>
		<link>http://csscircle.wordpress.com/2008/10/04/from-photoshop-to-xhtml-and-css/</link>
		<comments>http://csscircle.wordpress.com/2008/10/04/from-photoshop-to-xhtml-and-css/#comments</comments>
		<pubDate>Sat, 04 Oct 2008 10:44:53 +0000</pubDate>
		<dc:creator>siddesigner</dc:creator>
				<category><![CDATA[CSS]]></category>
		<category><![CDATA[css tips]]></category>
		<category><![CDATA[css tricks]]></category>
		<category><![CDATA[Photoshop to XHTML and CSS]]></category>

		<guid isPermaLink="false">http://csscircle.wordpress.com/?p=55</guid>
		<description><![CDATA[Welcome everyone, to another long yet humourous tutorial from me! This one is going to take you through every nook and cranny of taking a lovely, glossy layout from Photoshop and putting it into a webpage with no tables, valid XHTML and CSS.
Here&#8217;s the one we&#8217;re going to be working with today, and later on [...]<img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=csscircle.wordpress.com&blog=4330425&post=55&subd=csscircle&ref=&feed=1" />]]></description>
		<wfw:commentRss>http://csscircle.wordpress.com/2008/10/04/from-photoshop-to-xhtml-and-css/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
	
		<media:content url="http://1.gravatar.com/avatar/9762354ed8cd3d054cc0b34675c4f34e?s=96&#38;d=identicon&#38;r=G" medium="image">
			<media:title type="html">siddesigner</media:title>
		</media:content>

		<media:content url="http://www.webdesign.org/img_articles/11121/_1.jpg" medium="image">
			<media:title type="html">Click to enlarge</media:title>
		</media:content>

		<media:content url="http://www.webdesign.org/img_articles/11121/_2.jpg" medium="image">
			<media:title type="html">Click to enlarge</media:title>
		</media:content>

		<media:content url="http://www.webdesign.org/img_articles/11121/3.jpg" medium="image">
			<media:title type="html">image 3</media:title>
		</media:content>

		<media:content url="http://www.webdesign.org/img_articles/11121/_4.jpg" medium="image">
			<media:title type="html">Click to enlarge</media:title>
		</media:content>

		<media:content url="http://www.webdesign.org/img_articles/11121/_5.jpg" medium="image">
			<media:title type="html">Click to enlarge</media:title>
		</media:content>

		<media:content url="http://www.webdesign.org/img_articles/11121/_6.jpg" medium="image">
			<media:title type="html">Click to enlarge</media:title>
		</media:content>

		<media:content url="http://www.webdesign.org/img_articles/11121/7.jpg" medium="image">
			<media:title type="html">image 7</media:title>
		</media:content>

		<media:content url="http://www.webdesign.org/img_articles/11121/_8.jpg" medium="image">
			<media:title type="html">Click to enlarge</media:title>
		</media:content>

		<media:content url="http://www.webdesign.org/img_articles/11121/9.jpg" medium="image">
			<media:title type="html">image 9</media:title>
		</media:content>

		<media:content url="http://www.webdesign.org/img_articles/11121/_10.jpg" medium="image">
			<media:title type="html">image 10</media:title>
		</media:content>

		<media:content url="http://www.webdesign.org/img_articles/11121/_11.jpg" medium="image">
			<media:title type="html">Click to enlarge</media:title>
		</media:content>

		<media:content url="http://www.webdesign.org/img_articles/11121/_12.jpg" medium="image">
			<media:title type="html">Click to enlarge</media:title>
		</media:content>

		<media:content url="http://www.webdesign.org/img_articles/11121/13.gif" medium="image">
			<media:title type="html">image 13</media:title>
		</media:content>
	</item>
		<item>
		<title>How to Assign Custom List Bullets with CSS</title>
		<link>http://csscircle.wordpress.com/2008/10/04/how-to-assign-custom-list-bullets-with-css/</link>
		<comments>http://csscircle.wordpress.com/2008/10/04/how-to-assign-custom-list-bullets-with-css/#comments</comments>
		<pubDate>Sat, 04 Oct 2008 10:42:05 +0000</pubDate>
		<dc:creator>siddesigner</dc:creator>
				<category><![CDATA[CSS]]></category>
		<category><![CDATA[css advanced list]]></category>
		<category><![CDATA[css list]]></category>
		<category><![CDATA[css tips]]></category>
		<category><![CDATA[css tricks]]></category>

		<guid isPermaLink="false">http://csscircle.wordpress.com/?p=53</guid>
		<description><![CDATA[
 1. In your html page embed link to your css file:



&#60;html&#62;
&#60;head&#62;
&#60;title&#62;Test Document&#60;/title&#62;
&#60;link href=&#8221;styles.css&#8221; rel=&#8221;stylesheet&#8221; type=&#8221;text/css&#8221;&#62;
&#60;/head&#62;
&#60;body&#62;
&#60;/body&#62;
&#60;/html&#62;



 2. Create your bulleted list. Here is ours:



&#60;p&#62;Most popular apple varieties in New England today:&#60;/p&#62;
&#60;ul&#62;
&#60;li&#62;McIntosh&#60;/li&#62;
&#60;li&#62;Cortland&#60;/li&#62;
&#60;li&#62;Red Delicious&#60;/li&#62;
&#60;li&#62;Empire&#60;/li&#62;
&#60;li&#62;Rome&#60;/li&#62;
&#60;/ul&#62;




 3. In css file we will redefine &#60;li&#62; tag. Let’s change these default bullets to our custom bullets.



li {
list-style-position: outside;
list-style-image: url(your_bullet.gif);
}




 4. Format [...]<img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=csscircle.wordpress.com&blog=4330425&post=53&subd=csscircle&ref=&feed=1" />]]></description>
		<wfw:commentRss>http://csscircle.wordpress.com/2008/10/04/how-to-assign-custom-list-bullets-with-css/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
	
		<media:content url="http://1.gravatar.com/avatar/9762354ed8cd3d054cc0b34675c4f34e?s=96&#38;d=identicon&#38;r=G" medium="image">
			<media:title type="html">siddesigner</media:title>
		</media:content>

		<media:content url="http://www.webdesign.org/img_articles/12817/tut_custombullet1.gif" medium="image">
			<media:title type="html">image 1</media:title>
		</media:content>

		<media:content url="http://www.webdesign.org/img_articles/12817/tut_custombullet2.gif" medium="image">
			<media:title type="html">image 2</media:title>
		</media:content>

		<media:content url="http://www.webdesign.org/img_articles/12817/tut_custombullet3.gif" medium="image">
			<media:title type="html">image 3</media:title>
		</media:content>

		<media:content url="http://www.webdesign.org/img_articles/12817/tut_custombullet4.gif" medium="image">
			<media:title type="html">Final Result</media:title>
		</media:content>
	</item>
		<item>
		<title>CSS Background Rollover</title>
		<link>http://csscircle.wordpress.com/2008/10/04/css-background-rollover/</link>
		<comments>http://csscircle.wordpress.com/2008/10/04/css-background-rollover/#comments</comments>
		<pubDate>Sat, 04 Oct 2008 10:41:17 +0000</pubDate>
		<dc:creator>siddesigner</dc:creator>
				<category><![CDATA[CSS]]></category>
		<category><![CDATA[css tips]]></category>
		<category><![CDATA[css tricks]]></category>

		<guid isPermaLink="false">http://csscircle.wordpress.com/?p=51</guid>
		<description><![CDATA[Looking to add a little style to your image links? Let&#8217;s use CSS to add a background color that appears when the mouse hovers over the image. This style can be used on a variety of images but we&#8217;ll be looking at adding this style to affiliate buttons.
 Step 1 
First, we have the html [...]<img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=csscircle.wordpress.com&blog=4330425&post=51&subd=csscircle&ref=&feed=1" />]]></description>
		<wfw:commentRss>http://csscircle.wordpress.com/2008/10/04/css-background-rollover/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
	
		<media:content url="http://1.gravatar.com/avatar/9762354ed8cd3d054cc0b34675c4f34e?s=96&#38;d=identicon&#38;r=G" medium="image">
			<media:title type="html">siddesigner</media:title>
		</media:content>
	</item>
		<item>
		<title>Text with Shadow using CSS</title>
		<link>http://csscircle.wordpress.com/2008/10/04/text-with-shadow-using-css/</link>
		<comments>http://csscircle.wordpress.com/2008/10/04/text-with-shadow-using-css/#comments</comments>
		<pubDate>Sat, 04 Oct 2008 10:35:17 +0000</pubDate>
		<dc:creator>siddesigner</dc:creator>
				<category><![CDATA[CSS]]></category>
		<category><![CDATA[css tips]]></category>
		<category><![CDATA[html]]></category>
		<category><![CDATA[tricks]]></category>

		<guid isPermaLink="false">http://csscircle.wordpress.com/?p=47</guid>
		<description><![CDATA[This tutorial explains how to create a text with shadow using CSS.
It has been tested and works with the following browsers:

Firefox 2.0.0.4
Internet Explorer 6.0
Mozilla 1.7.13
Opera 9.21
Netscape 8.0.4

You can see it in action here: Demo.
First let&#8217;s create a structure of our text container together with a text.



&#60;div id=&#8221;wrapper&#8221;&#62;
&#60;span class=&#8221;firstlayer&#8221;&#62;Text with shadow using CSS&#60;/span&#62;
&#60;span class=&#8221;secondlayer&#8221;&#62;Text with shadow [...]<img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=csscircle.wordpress.com&blog=4330425&post=47&subd=csscircle&ref=&feed=1" />]]></description>
		<wfw:commentRss>http://csscircle.wordpress.com/2008/10/04/text-with-shadow-using-css/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
	
		<media:content url="http://1.gravatar.com/avatar/9762354ed8cd3d054cc0b34675c4f34e?s=96&#38;d=identicon&#38;r=G" medium="image">
			<media:title type="html">siddesigner</media:title>
		</media:content>
	</item>
		<item>
		<title>10 Usability Principles to guide you through the</title>
		<link>http://csscircle.wordpress.com/2008/09/29/10-usability-principles-to-guide-you-through-the/</link>
		<comments>http://csscircle.wordpress.com/2008/09/29/10-usability-principles-to-guide-you-through-the/#comments</comments>
		<pubDate>Mon, 29 Sep 2008 10:42:22 +0000</pubDate>
		<dc:creator>siddesigner</dc:creator>
				<category><![CDATA[Usability]]></category>
		<category><![CDATA[articls]]></category>
		<category><![CDATA[CSS]]></category>

		<guid isPermaLink="false">http://csscircle.wordpress.com/?p=34</guid>
		<description><![CDATA[
Motivate 
Design your site to meet specific user needs and goals. Use motivators to draw different user &#8220;personae&#8221; into specific parts of your site.
User task flow 
Who are your users? What are their tasks and online environment? For a site to be usable, page flow must match workflow.
Architecture – it&#8217;s 80% of usability 
Build an efficient navigational structure. [...]<img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=csscircle.wordpress.com&blog=4330425&post=34&subd=csscircle&ref=&feed=1" />]]></description>
		<wfw:commentRss>http://csscircle.wordpress.com/2008/09/29/10-usability-principles-to-guide-you-through-the/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
	
		<media:content url="http://1.gravatar.com/avatar/9762354ed8cd3d054cc0b34675c4f34e?s=96&#38;d=identicon&#38;r=G" medium="image">
			<media:title type="html">siddesigner</media:title>
		</media:content>
	</item>
		<item>
		<title>Efficient CSS with shorthand properties</title>
		<link>http://csscircle.wordpress.com/2008/09/11/efficient-css-with-shorthand-properties/</link>
		<comments>http://csscircle.wordpress.com/2008/09/11/efficient-css-with-shorthand-properties/#comments</comments>
		<pubDate>Thu, 11 Sep 2008 15:00:29 +0000</pubDate>
		<dc:creator>siddesigner</dc:creator>
				<category><![CDATA[Uncategorized]]></category>
		<category><![CDATA[CSS]]></category>
		<category><![CDATA[shorthand properties]]></category>
		<category><![CDATA[tags]]></category>

		<guid isPermaLink="false">http://csscircle.wordpress.com/?p=30</guid>
		<description><![CDATA[

I get a lot of questions about CSS from people who aren’t crazy enough to have spent the thousands of hours working with CSS that I have. Sometimes I’m asked to take a look at something they’re working on to see if I can figure out why it doesn’t work as expected. When I look [...]<img alt="" border="0" src="http://stats.wordpress.com/b.gif?host=csscircle.wordpress.com&blog=4330425&post=30&subd=csscircle&ref=&feed=1" />]]></description>
		<wfw:commentRss>http://csscircle.wordpress.com/2008/09/11/efficient-css-with-shorthand-properties/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
	
		<media:content url="http://1.gravatar.com/avatar/9762354ed8cd3d054cc0b34675c4f34e?s=96&#38;d=identicon&#38;r=G" medium="image">
			<media:title type="html">siddesigner</media:title>
		</media:content>
	</item>
	</channel>
</rss>