<?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>DesignTrek &#187; Menu</title>
	<atom:link href="http://www.designtrek.com/archives/category/menu/feed" rel="self" type="application/rss+xml" />
	<link>http://www.designtrek.com</link>
	<description>Design, Video Editing and Technology Blog</description>
	<lastBuildDate>Fri, 26 Jun 2009 04:15:10 +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>CSS Horizontal Menu</title>
		<link>http://www.designtrek.com/archives/css-horizontal-menu</link>
		<comments>http://www.designtrek.com/archives/css-horizontal-menu#comments</comments>
		<pubDate>Wed, 03 Sep 2008 21:00:18 +0000</pubDate>
		<dc:creator>Paul Martin</dc:creator>
				<category><![CDATA[CSS]]></category>
		<category><![CDATA[Menu]]></category>
		<category><![CDATA[design]]></category>

		<guid isPermaLink="false">http://www.designtrek.com/?p=3</guid>
		<description><![CDATA[Currently, I&#8217;m trying to CSS a Horizontal Menu.  I know there are MANY MANY hundreds of tutorials out there, but this one is a funny one.  And should be really easy to figure out&#8230; but I have had this thing rolling around in my head for so long that I need to step back from [...]]]></description>
			<content:encoded><![CDATA[<p>Currently, I&#8217;m trying to CSS a Horizontal Menu.  I know there are MANY MANY hundreds of tutorials out there, but this one is a funny one.  And should be really easy to figure out&#8230; but I have had this thing rolling around in my head for so long that I need to step back from it for a while.  That ever happen to you?  Anyway, here&#8217;s an image of the buttons.</p>
<p><a href="http://www.designtrek.com/wp-content/uploads/2008/09/menu_top_single_guide.gif" rel="lightbox[3]"><img class="aligncenter size-full wp-image-4" title="Menu - Top" src="http://www.designtrek.com/wp-content/uploads/2008/09/menu_top_single_guide.gif" alt="" width="420" height="66" /></a></p>
<p>You see, what I want it to do, is have each of the three buttons appear as the grey top bar does.  When you mouse-over one of the buttons, it should turn into one of the light green buttons, but only the button that you&#8217;re on.  When a button has been clicked, and you&#8217;re on the page, that button should remain in the &#8220;Active state.&#8221;</p>
<p>What I&#8217;ve been running into are things like: Only the text has the button in the background.  Only ONE of the mouseover images works, and it works across all three of the buttons (the right-side button appearing above, and not behind, all three of the links).</p>
<p>It&#8217;s kind of driving me insane, but I might figure it out soon.  Any suggestions?</p>



Share and Enjoy:


	<a rel="nofollow"  target="_blank" href="http://www.stumbleupon.com/submit?url=http%3A%2F%2Fwww.designtrek.com%2Farchives%2Fcss-horizontal-menu&amp;title=CSS%20Horizontal%20Menu" title="StumbleUpon"><img src="http://www.designtrek.com/wp-content/plugins/sociable/images/stumbleupon.png" title="StumbleUpon" alt="StumbleUpon" class="sociable-hovers" /></a>
	<a rel="nofollow"  target="_blank" href="http://www.designfloat.com/submit.php?url=http%3A%2F%2Fwww.designtrek.com%2Farchives%2Fcss-horizontal-menu&amp;title=CSS%20Horizontal%20Menu" title="Design Float"><img src="http://www.designtrek.com/wp-content/plugins/sociable/images/designfloat.png" title="Design Float" alt="Design Float" class="sociable-hovers" /></a>
	<a rel="nofollow"  target="_blank" href="http://digg.com/submit?phase=2&amp;url=http%3A%2F%2Fwww.designtrek.com%2Farchives%2Fcss-horizontal-menu&amp;title=CSS%20Horizontal%20Menu&amp;bodytext=Currently%2C%20I%27m%20trying%20to%20CSS%20a%20Horizontal%20Menu.%20%C2%A0I%20know%20there%20are%20MANY%20MANY%20hundreds%20of%20tutorials%20out%20there%2C%20but%20this%20one%20is%20a%20funny%20one.%C2%A0%20And%20should%20be%20really%20easy%20to%20figure%20out...%20but%20I%20have%20had%20this%20thing%20rolling%20around%20in%20my%20head%20for%20so%20long%20th" title="Digg"><img src="http://www.designtrek.com/wp-content/plugins/sociable/images/digg.png" title="Digg" alt="Digg" class="sociable-hovers" /></a>
	<a rel="nofollow"  target="_blank" href="http://delicious.com/post?url=http%3A%2F%2Fwww.designtrek.com%2Farchives%2Fcss-horizontal-menu&amp;title=CSS%20Horizontal%20Menu&amp;notes=Currently%2C%20I%27m%20trying%20to%20CSS%20a%20Horizontal%20Menu.%20%C2%A0I%20know%20there%20are%20MANY%20MANY%20hundreds%20of%20tutorials%20out%20there%2C%20but%20this%20one%20is%20a%20funny%20one.%C2%A0%20And%20should%20be%20really%20easy%20to%20figure%20out...%20but%20I%20have%20had%20this%20thing%20rolling%20around%20in%20my%20head%20for%20so%20long%20th" title="del.icio.us"><img src="http://www.designtrek.com/wp-content/plugins/sociable/images/delicious.png" title="del.icio.us" alt="del.icio.us" class="sociable-hovers" /></a>
	<a rel="nofollow"  target="_blank" href="" title="TwitThis"><img src="http://www.designtrek.com/wp-content/plugins/sociable/images/" title="TwitThis" alt="TwitThis" class="sociable-hovers" /></a>
	<a rel="nofollow"  target="_blank" href="mailto:?subject=CSS%20Horizontal%20Menu&amp;body=http%3A%2F%2Fwww.designtrek.com%2Farchives%2Fcss-horizontal-menu" title="email"><img src="http://www.designtrek.com/wp-content/plugins/sociable/images/email_link.png" title="email" alt="email" class="sociable-hovers" /></a>
	<a rel="nofollow"  target="_blank" href="http://www.facebook.com/share.php?u=http%3A%2F%2Fwww.designtrek.com%2Farchives%2Fcss-horizontal-menu&amp;t=CSS%20Horizontal%20Menu" title="Facebook"><img src="http://www.designtrek.com/wp-content/plugins/sociable/images/facebook.png" title="Facebook" alt="Facebook" class="sociable-hovers" /></a>
	<a rel="nofollow"  target="_blank" href="http://technorati.com/faves?add=http%3A%2F%2Fwww.designtrek.com%2Farchives%2Fcss-horizontal-menu" title="Technorati"><img src="http://www.designtrek.com/wp-content/plugins/sociable/images/technorati.png" title="Technorati" alt="Technorati" class="sociable-hovers" /></a>
	<a rel="nofollow"  target="_blank" href="" title="Votetime"><img src="http://www.designtrek.com/wp-content/plugins/sociable/images/" title="Votetime" alt="Votetime" class="sociable-hovers" /></a>


<br/><br/>]]></content:encoded>
			<wfw:commentRss>http://www.designtrek.com/archives/css-horizontal-menu/feed</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
	</channel>
</rss>
