<?xml version="1.0" encoding="utf-8"?>
<rss version="2.0" xmlns:dc="http://purl.org/dc/elements/1.1/">
<channel>
<title>Snipplr</title>
<link>http://snipplr.com/language/css/tags/button</link>
<description>Recent snippets posted on Snipplr.com</description>
<language>en-us</language>
<pubDate>Mon, 20 May 2013 03:00:53 GMT</pubDate>
<item>
<title>(CSS) Simple CSS3 Play Button - devowhippit</title>
<link>http://snipplr.com/view/70174/simple-css3-play-button/</link>
<description><![CDATA[ <p>Uses CSS3 attributes and psuedo elements to create a simple play button for web interfaces.</p> ]]></description>
<pubDate>Fri, 01 Mar 2013 02:54:00 GMT</pubDate>
<guid>http://snipplr.com/view/70174/simple-css3-play-button/</guid>
</item>
<item>
<title>(CSS) Nice Gradient Button with Hover all CSS - ryanfiorini</title>
<link>http://snipplr.com/view/64338/nice-gradient-button-with-hover-all-css/</link>
<description><![CDATA[ <p>This uses transitions for the hover effect which has limited IE support.</p> ]]></description>
<pubDate>Tue, 03 Apr 2012 22:40:15 GMT</pubDate>
<guid>http://snipplr.com/view/64338/nice-gradient-button-with-hover-all-css/</guid>
</item>
<item>
<title>(CSS) Fix for button background image in IE - felicemente</title>
<link>http://snipplr.com/view/64226/fix-for-button-background-image-in-ie/</link>
<description><![CDATA[ <p>rather annoying issue that I encountered and spent too much time researching - the relevant IE fix is in all caps</p> ]]></description>
<pubDate>Fri, 30 Mar 2012 05:45:49 GMT</pubDate>
<guid>http://snipplr.com/view/64226/fix-for-button-background-image-in-ie/</guid>
</item>
<item>
<title>(CSS) Expandable stretchy image button - stephcode</title>
<link>http://snipplr.com/view/59551/expandable-stretchy-image-button/</link>
<description><![CDATA[ <p>Replace background colors with your images.</p> ]]></description>
<pubDate>Sat, 08 Oct 2011 05:56:54 GMT</pubDate>
<guid>http://snipplr.com/view/59551/expandable-stretchy-image-button/</guid>
</item>
<item>
<title>(CSS) Blue Pill with Icon Button - ichnoweb</title>
<link>http://snipplr.com/view/51929/blue-pill-with-icon-button/</link>
<description><![CDATA[ <p></p> ]]></description>
<pubDate>Mon, 11 Apr 2011 20:06:44 GMT</pubDate>
<guid>http://snipplr.com/view/51929/blue-pill-with-icon-button/</guid>
</item>
<item>
<title>(CSS) Red Pill Button - ichnoweb</title>
<link>http://snipplr.com/view/51928/red-pill-button/</link>
<description><![CDATA[ <p></p> ]]></description>
<pubDate>Mon, 11 Apr 2011 20:04:20 GMT</pubDate>
<guid>http://snipplr.com/view/51928/red-pill-button/</guid>
</item>
<item>
<title>(CSS) Rounded Button - ichnoweb</title>
<link>http://snipplr.com/view/51927/rounded-button/</link>
<description><![CDATA[ <p>A two line, css-styled button.</p> ]]></description>
<pubDate>Mon, 11 Apr 2011 20:02:44 GMT</pubDate>
<guid>http://snipplr.com/view/51927/rounded-button/</guid>
</item>
<item>
<title>(CSS) CSS3 Glass Button - Keliah</title>
<link>http://snipplr.com/view/50166/css3-glass-button/</link>
<description><![CDATA[ <p>CSS3 button with a transparent glass effect (looks better on a textured background). A snapshot can be seen Here</p> ]]></description>
<pubDate>Mon, 07 Mar 2011 00:33:00 GMT</pubDate>
<guid>http://snipplr.com/view/50166/css3-glass-button/</guid>
</item>
<item>
<title>(CSS) Zurb.com Awesome Button - SixteenOne</title>
<link>http://snipplr.com/view/48184/zurbcom-awesome-button/</link>
<description><![CDATA[ <p></p> ]]></description>
<pubDate>Tue, 01 Feb 2011 09:32:25 GMT</pubDate>
<guid>http://snipplr.com/view/48184/zurbcom-awesome-button/</guid>
</item>
<item>
<title>(CSS) CSS3 Gradient Buttons - adriano</title>
<link>http://snipplr.com/view/47951/css3-gradient-buttons/</link>
<description><![CDATA[ <p></p> ]]></description>
<pubDate>Thu, 27 Jan 2011 06:20:18 GMT</pubDate>
<guid>http://snipplr.com/view/47951/css3-gradient-buttons/</guid>
</item>
<item>
<title>(CSS) firefox dotted line on focus - jesudasjj</title>
<link>http://snipplr.com/view/47131/firefox-dotted-line-on-focus/</link>
<description><![CDATA[ <p></p> ]]></description>
<pubDate>Fri, 14 Jan 2011 17:14:46 GMT</pubDate>
<guid>http://snipplr.com/view/47131/firefox-dotted-line-on-focus/</guid>
</item>
<item>
<title>(CSS) CSS button replacement - shodan_uk</title>
<link>http://snipplr.com/view/46870/css-button-replacement/</link>
<description><![CDATA[ <p></p> ]]></description>
<pubDate>Mon, 10 Jan 2011 22:31:57 GMT</pubDate>
<guid>http://snipplr.com/view/46870/css-button-replacement/</guid>
</item>
<item>
<title>(CSS) Remove firefox buttons padding - Ashung</title>
<link>http://snipplr.com/view/44801/remove-firefox-buttons-padding/</link>
<description><![CDATA[ <p>Remove firefox buttons padding</p> ]]></description>
<pubDate>Wed, 24 Nov 2010 19:31:14 GMT</pubDate>
<guid>http://snipplr.com/view/44801/remove-firefox-buttons-padding/</guid>
</item>
<item>
<title>(CSS) Pure CSS button with rounded corners, gradient and shadow - alozuldo</title>
<link>http://snipplr.com/view/43008/pure-css-button-with-rounded-corners-gradient-and-shadow/</link>
<description><![CDATA[ <p></p> ]]></description>
<pubDate>Wed, 27 Oct 2010 08:43:54 GMT</pubDate>
<guid>http://snipplr.com/view/43008/pure-css-button-with-rounded-corners-gradient-and-shadow/</guid>
</item>
<item>
<title>(CSS) Fancy CSS Button - Green - nathanlong</title>
<link>http://snipplr.com/view/42374/fancy-css-button--green/</link>
<description><![CDATA[ <p>Green button with color transitions for both text and the background on hover. The transition only works for webkit browsers currently. Users in IE will only see a boxy button, no rounded corners or transitions, but a button all the same.</p> ]]></description>
<pubDate>Sat, 16 Oct 2010 03:27:36 GMT</pubDate>
<guid>http://snipplr.com/view/42374/fancy-css-button--green/</guid>
</item>
<item>
<title>(CSS) CSS  Format Links, Buttons and Submits To Be The Same Style (Cross Browser) - Meander365</title>
<link>http://snipplr.com/view/41132/css--format-links-buttons-and-submits-to-be-the-same-style-cross-browser/</link>
<description><![CDATA[ <p>This also use PIE.htc to force rounded corners in IE.</p> ]]></description>
<pubDate>Wed, 29 Sep 2010 08:36:11 GMT</pubDate>
<guid>http://snipplr.com/view/41132/css--format-links-buttons-and-submits-to-be-the-same-style-cross-browser/</guid>
</item>
<item>
<title>(CSS) green button - tunes3540</title>
<link>http://snipplr.com/view/38310/green-button/</link>
<description><![CDATA[ <p></p> ]]></description>
<pubDate>Wed, 04 Aug 2010 06:06:47 GMT</pubDate>
<guid>http://snipplr.com/view/38310/green-button/</guid>
</item>
<item>
<title>(CSS) CSS: Submit Button Background Images - karlhorky</title>
<link>http://snipplr.com/view/37068/css-submit-button-background-images/</link>
<description><![CDATA[ <p>There are three different types of elements that submit forms:

*  &amp;lt;input type="image"&amp;gt;
*  &amp;lt;input type="submit"&amp;gt;
*  &amp;lt;button type="submit"&amp;gt;

Logically, it would seem that you would want to use input type="image" if you wanted to display an image instead of a default button. However, using input type="image" causes the page to submit two extra variables for your x and y mouse click coordinates on the image as below. Unless you are specifically using this for advertising or some purpose that takes advantage of the coordinates, this is just unnecessary data that also causes the URL to become more complex.

Example URLs:

*  type="submit"
  *  http://www.site.com/form.php?query=searchterm
*  type="image"
  *  http://www.site.com/form.php?query=searchterm&amp;x=0&amp;y=0

Additionally, if you do not require additional information pertaining to the submit to be passed to the server (eg. you do not need to have two submits with different purposes), you can use a button element instead of an input. This also allows for simple hiding of the display text as outlined with the .hide-text class in this snippet (for if you wanted to put the text in the image instead).

This solution has been tested to work in:

*  Microsoft Internet Explorer 6, 7, 8
*  Mozilla Firefox 3.6
*  Google Chrome 5
*  Apple Safari 5
*  Opera 10</p> ]]></description>
<pubDate>Sat, 10 Jul 2010 08:45:15 GMT</pubDate>
<guid>http://snipplr.com/view/37068/css-submit-button-background-images/</guid>
</item>
<item>
<title>(CSS) Realistic Looking Button with CSS3 - marcio</title>
<link>http://snipplr.com/view/31446/realistic-looking-button-with-css3/</link>
<description><![CDATA[ <p></p> ]]></description>
<pubDate>Mon, 12 Apr 2010 14:44:38 GMT</pubDate>
<guid>http://snipplr.com/view/31446/realistic-looking-button-with-css3/</guid>
</item>
<item>
<title>(CSS) form button styling - tennison</title>
<link>http://snipplr.com/view/29545/form-button-styling/</link>
<description><![CDATA[ <p>original source - http://www.filamentgroup.com/lab/update_styling_the_button_element_with_css_sliding_doors_now_with_image_spr/

Overides default styling</p> ]]></description>
<pubDate>Wed, 10 Mar 2010 11:36:29 GMT</pubDate>
<guid>http://snipplr.com/view/29545/form-button-styling/</guid>
</item>
</channel>
</rss>