<?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>AtomicPages Blog &#187; CSS Advanced</title>
	<atom:link href="http://www.atomicpages.net/blog/category/css/css_advanced/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.atomicpages.net/blog</link>
	<description>Web Hosting, Design, and Development</description>
	<lastBuildDate>Tue, 20 Jul 2010 19:01:23 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.0</generator>
		<item>
		<title>Creating an Inline Menu</title>
		<link>http://www.atomicpages.net/blog/2010/04/15/creating-an-inline-menu/</link>
		<comments>http://www.atomicpages.net/blog/2010/04/15/creating-an-inline-menu/#comments</comments>
		<pubDate>Thu, 15 Apr 2010 17:00:08 +0000</pubDate>
		<dc:creator>Dennis Thompson</dc:creator>
				<category><![CDATA[CSS]]></category>
		<category><![CDATA[CSS Advanced]]></category>
		<category><![CDATA[HTML]]></category>
		<category><![CDATA[HTML/XHTML Advanced]]></category>
		<category><![CDATA[Web Design]]></category>

		<guid isPermaLink="false">http://www.atomicpages.net/blog/?p=2355</guid>
		<description><![CDATA[Creating an inline menu should seem pretty straight forward, right? You think we could just create an unordered list and that would be the end of the story. Unfortunately, if we create an unordered list we&#8217;ll quickly see that these lists types merely list item one on top of the other.

Item 1
Item 2
Item 3

This is <a href="http://www.atomicpages.net/blog/2010/04/15/creating-an-inline-menu/" class="more-link">More &#62;</a>]]></description>
		<wfw:commentRss>http://www.atomicpages.net/blog/2010/04/15/creating-an-inline-menu/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Advanced CSS Part -#7</title>
		<link>http://www.atomicpages.net/blog/2010/01/10/advanced-css-part-7/</link>
		<comments>http://www.atomicpages.net/blog/2010/01/10/advanced-css-part-7/#comments</comments>
		<pubDate>Sun, 10 Jan 2010 17:00:50 +0000</pubDate>
		<dc:creator>Dennis Thompson</dc:creator>
				<category><![CDATA[CSS Advanced]]></category>
		<category><![CDATA[Web Design]]></category>

		<guid isPermaLink="false">http://www.atomicpages.net/blog/?p=1372</guid>
		<description><![CDATA[Today we&#8217;re going to create a top navigation menu and side menu in CSS. This is like any website menu that we would see on most websites.
Inline Menu
This is an example of a website menu:

We can see that the menu is entirely inline and is actually really just an unordered list. Consider the following code:

#menu <a href="http://www.atomicpages.net/blog/2010/01/10/advanced-css-part-7/" class="more-link">More &#62;</a>]]></description>
		<wfw:commentRss>http://www.atomicpages.net/blog/2010/01/10/advanced-css-part-7/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Advanced CSS &#8211; Part #6</title>
		<link>http://www.atomicpages.net/blog/2010/01/01/advanced-css-part-6/</link>
		<comments>http://www.atomicpages.net/blog/2010/01/01/advanced-css-part-6/#comments</comments>
		<pubDate>Fri, 01 Jan 2010 17:00:23 +0000</pubDate>
		<dc:creator>Dennis Thompson</dc:creator>
				<category><![CDATA[CSS Advanced]]></category>
		<category><![CDATA[Web Design]]></category>

		<guid isPermaLink="false">http://www.atomicpages.net/blog/?p=1293</guid>
		<description><![CDATA[Pseudo-elements are used to add special effects to some html elements.
Pseudo-elements are very much like pseudo-classes. The syntax for pseudo-elements is like pseudo-classes:

selector:pseudo-element {property:value;}

We can also use class selectors with our pseudo-elements:

selector.class:pseudo-element {property:value;}

Pseudo-elements
Since pseudo-elements exist to give some html elements some flair, we have a few special pseudo-elements that we need to be familiar with.
:first-line
As <a href="http://www.atomicpages.net/blog/2010/01/01/advanced-css-part-6/" class="more-link">More &#62;</a>]]></description>
		<wfw:commentRss>http://www.atomicpages.net/blog/2010/01/01/advanced-css-part-6/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Advanced CSS &#8211; Part #5</title>
		<link>http://www.atomicpages.net/blog/2009/12/29/advanced-css-part-5/</link>
		<comments>http://www.atomicpages.net/blog/2009/12/29/advanced-css-part-5/#comments</comments>
		<pubDate>Tue, 29 Dec 2009 17:00:50 +0000</pubDate>
		<dc:creator>Dennis Thompson</dc:creator>
				<category><![CDATA[CSS Advanced]]></category>
		<category><![CDATA[Web Design]]></category>

		<guid isPermaLink="false">http://atomicpages.net/blog/?p=1015</guid>
		<description><![CDATA[Pseudo-classes are little snippets of code that will add additional effects to some selectors.
Pseudo-classes
The syntax for Pseudo-classes is very much like the syntax for css:

selector {property:value;} /*CSS Syntax*/
selector:pseudo-class { /*Pseudo-class Syntax*/
     property:value;
     property:value;
}

:link, :visited, :active, :hover
A very widely used example of Pseudo-classes is adding styles to links. <a href="http://www.atomicpages.net/blog/2009/12/29/advanced-css-part-5/" class="more-link">More &#62;</a>]]></description>
		<wfw:commentRss>http://www.atomicpages.net/blog/2009/12/29/advanced-css-part-5/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>Advanced CSS &#8211; Part #4</title>
		<link>http://www.atomicpages.net/blog/2009/12/18/advanced-css-part-4/</link>
		<comments>http://www.atomicpages.net/blog/2009/12/18/advanced-css-part-4/#comments</comments>
		<pubDate>Fri, 18 Dec 2009 17:00:46 +0000</pubDate>
		<dc:creator>Dennis Thompson</dc:creator>
				<category><![CDATA[CSS Advanced]]></category>
		<category><![CDATA[Web Design]]></category>

		<guid isPermaLink="false">http://atomicpages.net/blog/?p=962</guid>
		<description><![CDATA[In this tutorial we&#8217;re going to talk about the float property. For this tutorial you will need to be familiar with the Basics of CSS and you should be familiar with the Advanced CSS tutorials until this point.
Float Property
The float property allows for an element to be pushed to the left or the right so <a href="http://www.atomicpages.net/blog/2009/12/18/advanced-css-part-4/" class="more-link">More &#62;</a>]]></description>
		<wfw:commentRss>http://www.atomicpages.net/blog/2009/12/18/advanced-css-part-4/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Advanced CSS &#8211; Part #3</title>
		<link>http://www.atomicpages.net/blog/2009/12/09/advanced-css-part-3/</link>
		<comments>http://www.atomicpages.net/blog/2009/12/09/advanced-css-part-3/#comments</comments>
		<pubDate>Wed, 09 Dec 2009 17:00:10 +0000</pubDate>
		<dc:creator>Dennis Thompson</dc:creator>
				<category><![CDATA[CSS Advanced]]></category>
		<category><![CDATA[Web Design]]></category>

		<guid isPermaLink="false">http://atomicpages.net/blog/?p=925</guid>
		<description><![CDATA[Today we&#8217;re going to talk about advanced positioning techniques. This is a widely used property in CSS and it very useful! Positioning allows you to position an element, place one element behind another, and determine what happens when an element is too big.
The position of an element is controlled by top, right, bottom, and left <a href="http://www.atomicpages.net/blog/2009/12/09/advanced-css-part-3/" class="more-link">More &#62;</a>]]></description>
		<wfw:commentRss>http://www.atomicpages.net/blog/2009/12/09/advanced-css-part-3/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Advanced CSS &#8211; Part #2</title>
		<link>http://www.atomicpages.net/blog/2009/12/04/advanced-css-part-2/</link>
		<comments>http://www.atomicpages.net/blog/2009/12/04/advanced-css-part-2/#comments</comments>
		<pubDate>Fri, 04 Dec 2009 17:00:36 +0000</pubDate>
		<dc:creator>Dennis Thompson</dc:creator>
				<category><![CDATA[CSS Advanced]]></category>
		<category><![CDATA[Web Design]]></category>

		<guid isPermaLink="false">http://atomicpages.net/blog/?p=914</guid>
		<description><![CDATA[Today we&#8217;re going to talk about the display and visibility properties of CSS. This is the second advanced tutorial and is intended for those of us that already understand the Basics of CSS.
Visibility
The Visibility of an element can be adjusted by using this visibility property. Let us say that we want to make a certain <a href="http://www.atomicpages.net/blog/2009/12/04/advanced-css-part-2/" class="more-link">More &#62;</a>]]></description>
		<wfw:commentRss>http://www.atomicpages.net/blog/2009/12/04/advanced-css-part-2/feed/</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
		<item>
		<title>Advanced CSS &#8211; Part #1</title>
		<link>http://www.atomicpages.net/blog/2009/11/27/advanced-css-part-1/</link>
		<comments>http://www.atomicpages.net/blog/2009/11/27/advanced-css-part-1/#comments</comments>
		<pubDate>Fri, 27 Nov 2009 23:32:10 +0000</pubDate>
		<dc:creator>Dennis Thompson</dc:creator>
				<category><![CDATA[CSS Advanced]]></category>
		<category><![CDATA[Web Design]]></category>

		<guid isPermaLink="false">http://atomicpages.net/blog/?p=846</guid>
		<description><![CDATA[Now that we have all of the Basics of CSS down pat, we can move onto more advanced methods of writing and implementing style sheets!
Today we&#8217;re going to talk about grouping and nesting selectors and dimensions.
Grouping and Nesting
You might find yourself with selectors having the same values inside of your internal or external style sheet. <a href="http://www.atomicpages.net/blog/2009/11/27/advanced-css-part-1/" class="more-link">More &#62;</a>]]></description>
		<wfw:commentRss>http://www.atomicpages.net/blog/2009/11/27/advanced-css-part-1/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>
