<?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>SixThings &#187; CSS</title>
	<atom:link href="http://www.brownbatterystudios.com/sixthings/category/css/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.brownbatterystudios.com/sixthings</link>
	<description>Design wisdom in red and grey.</description>
	<lastBuildDate>Fri, 03 Feb 2012 08:13:03 +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>CSS3 Rounded Corners: Avoiding Image Clipping Problems</title>
		<link>http://www.brownbatterystudios.com/sixthings/2011/04/25/css3-rounded-corners-avoiding-image-clipping-problems/</link>
		<comments>http://www.brownbatterystudios.com/sixthings/2011/04/25/css3-rounded-corners-avoiding-image-clipping-problems/#comments</comments>
		<pubDate>Mon, 25 Apr 2011 14:33:17 +0000</pubDate>
		<dc:creator>Brownspank</dc:creator>
				<category><![CDATA[Chrome]]></category>
		<category><![CDATA[CSS]]></category>
		<category><![CDATA[Firefox]]></category>
		<category><![CDATA[HTML]]></category>
		<category><![CDATA[Internet Explorer]]></category>
		<category><![CDATA[Standards]]></category>

		<guid isPermaLink="false">http://www.brownbatterystudios.com/sixthings/?p=200</guid>
		<description><![CDATA[The Scenario Consider the following HTML+CSS setup: an img element wrapped in a div container with rounded corners (and optionally, a drop shadow); the div is sized to match the image&#8217;s dimensions, like so: &#60;!-- HTML --&#62; &#60;div class="rounded"&#62; &#160;&#160;&#160;&#160;&#60;img src="&#8230;" height="50" width="100" /&#62; &#60;/div&#62; /* CSS */ div.rounded { &#160;&#160;&#160;&#160;border-radius: 5px; &#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;-moz-border-radius: 5px; &#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;-webkit-border-radius: [...]You might also like:<ol>
<li><a href='http://www.brownbatterystudios.com/sixthings/2006/03/06/rapid-fire-1-photo-realistic/' rel='bookmark' title='Rapid Fire #1: Photo-Realistic'>Rapid Fire #1: Photo-Realistic</a></li>
<li><a href='http://www.brownbatterystudios.com/sixthings/2006/08/10/rapid-fire-5-image-editing-tricks-part-ii/' rel='bookmark' title='Rapid Fire #5: Image Editing Tricks Part II'>Rapid Fire #5: Image Editing Tricks Part II</a></li>
<li><a href='http://www.brownbatterystudios.com/sixthings/2007/09/20/rapid-fire-8-extracting-logos/' rel='bookmark' title='Rapid Fire #8: Extracting Logos'>Rapid Fire #8: Extracting Logos</a></li>
</ol>]]></description>
		<wfw:commentRss>http://www.brownbatterystudios.com/sixthings/2011/04/25/css3-rounded-corners-avoiding-image-clipping-problems/feed/</wfw:commentRss>
		<slash:comments>4</slash:comments>
		</item>
		<item>
		<title>Multibox: Troubleshooting Checklist</title>
		<link>http://www.brownbatterystudios.com/sixthings/2009/03/25/multibox-troubleshooting-checklist/</link>
		<comments>http://www.brownbatterystudios.com/sixthings/2009/03/25/multibox-troubleshooting-checklist/#comments</comments>
		<pubDate>Wed, 25 Mar 2009 08:33:27 +0000</pubDate>
		<dc:creator>Brownspank</dc:creator>
				<category><![CDATA[CSS]]></category>
		<category><![CDATA[HTML]]></category>
		<category><![CDATA[Javascript]]></category>

		<guid isPermaLink="false">http://www.brownbatterystudios.com/sixthings/?p=71</guid>
		<description><![CDATA[I ran into Phatfusion&#8216;s Multibox while looking for a way to display MOV files in a lightbox fashion. I know, there are probably better ways to do it, but I was pressed for time, and Multibox happened to be sitting in the first page of my search results, so I went with that. I liked [...]]]></description>
		<wfw:commentRss>http://www.brownbatterystudios.com/sixthings/2009/03/25/multibox-troubleshooting-checklist/feed/</wfw:commentRss>
		<slash:comments>38</slash:comments>
		</item>
		<item>
		<title>Are Vista Fonts Ready for the Web?</title>
		<link>http://www.brownbatterystudios.com/sixthings/2008/04/01/are-vista-fonts-ready-for-the-web/</link>
		<comments>http://www.brownbatterystudios.com/sixthings/2008/04/01/are-vista-fonts-ready-for-the-web/#comments</comments>
		<pubDate>Tue, 01 Apr 2008 07:49:36 +0000</pubDate>
		<dc:creator>Brownspank</dc:creator>
				<category><![CDATA[ClearType]]></category>
		<category><![CDATA[CSS]]></category>
		<category><![CDATA[Typography]]></category>
		<category><![CDATA[Vista]]></category>
		<category><![CDATA[Web]]></category>
		<category><![CDATA[Windows]]></category>

		<guid isPermaLink="false">http://www.brownbatterystudios.com/sixthings/?p=38</guid>
		<description><![CDATA[Windows Vista&#8482; ushered in a new set of screen-optimized typefaces, touted as successors to the Core Web fonts we&#8217;ve all become accustomed to. Already, we&#8217;ve seen early adopters and trendsetters updating their font-familys to prioritize the newer fonts (Calibri, Cambria, and Segoe UI being current favorites). It&#8217;s been over a year (I know, a little [...]You might also like:<ol>
<li><a href='http://www.brownbatterystudios.com/sixthings/2006/09/26/there-is-hardship-beyond-arial-verdana/' rel='bookmark' title='(There Is Hardship) Beyond Arial &amp; Verdana'>(There Is Hardship) Beyond Arial &#038; Verdana</a></li>
<li><a href='http://www.brownbatterystudios.com/sixthings/2006/11/27/simple-relative-font-size-equation/' rel='bookmark' title='Simple Relative Font Size Equation'>Simple Relative Font Size Equation</a></li>
<li><a href='http://www.brownbatterystudios.com/sixthings/2007/03/14/lucida-hybrid-the-grande-alternative/' rel='bookmark' title='Lucida Hybrid: The &#8216;Grande&#8217; Alternative'>Lucida Hybrid: The &#8216;Grande&#8217; Alternative</a></li>
</ol>]]></description>
		<wfw:commentRss>http://www.brownbatterystudios.com/sixthings/2008/04/01/are-vista-fonts-ready-for-the-web/feed/</wfw:commentRss>
		<slash:comments>8</slash:comments>
		</item>
		<item>
		<title>Lucida Hybrid: The &#8216;Grande&#8217; Alternative</title>
		<link>http://www.brownbatterystudios.com/sixthings/2007/03/14/lucida-hybrid-the-grande-alternative/</link>
		<comments>http://www.brownbatterystudios.com/sixthings/2007/03/14/lucida-hybrid-the-grande-alternative/#comments</comments>
		<pubDate>Wed, 14 Mar 2007 11:08:45 +0000</pubDate>
		<dc:creator>Brownspank</dc:creator>
				<category><![CDATA[CSS]]></category>
		<category><![CDATA[Typography]]></category>
		<category><![CDATA[Web]]></category>

		<guid isPermaLink="false">http://www.brownbatterystudios.com/sixthings/2007/03/14/lucida-hybrid-the-grande-alternative/</guid>
		<description><![CDATA[Lucida Grande is such a nice font to use in websites, but because it doesn&#8217;t come standard with Windows, we turn to Lucida Sans Unicode and Lucida Sans to make sure users get a similar look. Unfortunately, both typefaces have imperfections that make them less-than-worthy candidates for substitution. Oh, dear. Update 2007-03-13: Check out my [...]You might also like:<ol>
<li><a href='http://www.brownbatterystudios.com/sixthings/2006/09/26/there-is-hardship-beyond-arial-verdana/' rel='bookmark' title='(There Is Hardship) Beyond Arial &amp; Verdana'>(There Is Hardship) Beyond Arial &#038; Verdana</a></li>
<li><a href='http://www.brownbatterystudios.com/sixthings/2009/02/18/lucida-hybrid-revisited/' rel='bookmark' title='Lucida Hybrid Revisited'>Lucida Hybrid Revisited</a></li>
<li><a href='http://www.brownbatterystudios.com/sixthings/2008/04/01/are-vista-fonts-ready-for-the-web/' rel='bookmark' title='Are Vista Fonts Ready for the Web?'>Are Vista Fonts Ready for the Web?</a></li>
</ol>]]></description>
		<wfw:commentRss>http://www.brownbatterystudios.com/sixthings/2007/03/14/lucida-hybrid-the-grande-alternative/feed/</wfw:commentRss>
		<slash:comments>57</slash:comments>
		</item>
		<item>
		<title>CSS First-Aid for IE Peekaboo Bug</title>
		<link>http://www.brownbatterystudios.com/sixthings/2007/01/06/css-first-aid-for-ie-peekaboo-bug/</link>
		<comments>http://www.brownbatterystudios.com/sixthings/2007/01/06/css-first-aid-for-ie-peekaboo-bug/#comments</comments>
		<pubDate>Sat, 06 Jan 2007 13:40:53 +0000</pubDate>
		<dc:creator>Brownspank</dc:creator>
				<category><![CDATA[Bug]]></category>
		<category><![CDATA[CSS]]></category>
		<category><![CDATA[Internet Explorer]]></category>
		<category><![CDATA[Web]]></category>

		<guid isPermaLink="false">http://www.brownbatterystudios.com/sixthings/2007/01/06/css-first-aid-for-ie-peekaboo-bug/</guid>
		<description><![CDATA[That annoying IE peekaboo bug just doesn&#8217;t know when to stop. Apparently, even IE7 exhibits this bug, and it appears to be worse than its predecessor. If you happen to be pressed for time (or are lazy to search the Internets for a solution), applying a couple of stylesheet rules to the affected element should [...]You might also like:<ol>
<li><a href='http://www.brownbatterystudios.com/sixthings/2006/11/21/forming-effective-css-classes-ids/' rel='bookmark' title='Forming Effective CSS Classes &amp; IDs'>Forming Effective CSS Classes &#038; IDs</a></li>
<li><a href='http://www.brownbatterystudios.com/sixthings/2006/04/25/maximize-css-comment-usage/' rel='bookmark' title='Maximize CSS Comment Usage'>Maximize CSS Comment Usage</a></li>
<li><a href='http://www.brownbatterystudios.com/sixthings/2006/05/12/an-even-better-ie-button-width-fix/' rel='bookmark' title='An Even Better IE Button Width Fix'>An Even Better IE Button Width Fix</a></li>
</ol>]]></description>
		<wfw:commentRss>http://www.brownbatterystudios.com/sixthings/2007/01/06/css-first-aid-for-ie-peekaboo-bug/feed/</wfw:commentRss>
		<slash:comments>45</slash:comments>
		</item>
		<item>
		<title>Simple Relative Font Size Equation</title>
		<link>http://www.brownbatterystudios.com/sixthings/2006/11/27/simple-relative-font-size-equation/</link>
		<comments>http://www.brownbatterystudios.com/sixthings/2006/11/27/simple-relative-font-size-equation/#comments</comments>
		<pubDate>Mon, 27 Nov 2006 13:12:36 +0000</pubDate>
		<dc:creator>Brownspank</dc:creator>
				<category><![CDATA[CSS]]></category>
		<category><![CDATA[Design]]></category>
		<category><![CDATA[General]]></category>
		<category><![CDATA[Typography]]></category>
		<category><![CDATA[Web]]></category>

		<guid isPermaLink="false">http://www.brownbatterystudios.com/sixthings/2006/11/27/simple-relative-font-size-equation/</guid>
		<description><![CDATA[For those of you working with relative font-sizes in your CSS, here is a basic equation for getting the exact size equivalent in ems, given a desired px value: emr = pxt &#247; pxp, where&#160;emr = result font size, in ems;pxt = target font size, in px;pxp = parent element&#8217;s font size, in px; This [...]You might also like:<ol>
<li><a href='http://www.brownbatterystudios.com/sixthings/2006/09/26/there-is-hardship-beyond-arial-verdana/' rel='bookmark' title='(There Is Hardship) Beyond Arial &amp; Verdana'>(There Is Hardship) Beyond Arial &#038; Verdana</a></li>
<li><a href='http://www.brownbatterystudios.com/sixthings/2008/04/01/are-vista-fonts-ready-for-the-web/' rel='bookmark' title='Are Vista Fonts Ready for the Web?'>Are Vista Fonts Ready for the Web?</a></li>
<li><a href='http://www.brownbatterystudios.com/sixthings/2006/03/21/css-code-visual-grouping-techniques/' rel='bookmark' title='CSS Code Visual Grouping Techniques'>CSS Code Visual Grouping Techniques</a></li>
</ol>]]></description>
		<wfw:commentRss>http://www.brownbatterystudios.com/sixthings/2006/11/27/simple-relative-font-size-equation/feed/</wfw:commentRss>
		<slash:comments>12</slash:comments>
		</item>
		<item>
		<title>Forming Effective CSS Classes &amp; IDs</title>
		<link>http://www.brownbatterystudios.com/sixthings/2006/11/21/forming-effective-css-classes-ids/</link>
		<comments>http://www.brownbatterystudios.com/sixthings/2006/11/21/forming-effective-css-classes-ids/#comments</comments>
		<pubDate>Tue, 21 Nov 2006 12:42:59 +0000</pubDate>
		<dc:creator>Brownspank</dc:creator>
				<category><![CDATA[CSS]]></category>
		<category><![CDATA[Standards]]></category>
		<category><![CDATA[Web]]></category>

		<guid isPermaLink="false">http://www.brownbatterystudios.com/sixthings/2006/11/21/on-effective-css-class-id-selectors/</guid>
		<description><![CDATA[If you&#8217;ve ever had trouble establishing a naming standard for your CSS classes, or if you work closely with a developer who demands uniformity when assigning IDs elements, here are some conventions (as well as some of my personal preferences on usage) that should help you form effective, easy-to-remember and predictable names. CamelCase Popular among [...]You might also like:<ol>
<li><a href='http://www.brownbatterystudios.com/sixthings/2006/04/25/maximize-css-comment-usage/' rel='bookmark' title='Maximize CSS Comment Usage'>Maximize CSS Comment Usage</a></li>
</ol>]]></description>
		<wfw:commentRss>http://www.brownbatterystudios.com/sixthings/2006/11/21/forming-effective-css-classes-ids/feed/</wfw:commentRss>
		<slash:comments>7</slash:comments>
		</item>
		<item>
		<title>(There Is Hardship) Beyond Arial &amp; Verdana</title>
		<link>http://www.brownbatterystudios.com/sixthings/2006/09/26/there-is-hardship-beyond-arial-verdana/</link>
		<comments>http://www.brownbatterystudios.com/sixthings/2006/09/26/there-is-hardship-beyond-arial-verdana/#comments</comments>
		<pubDate>Tue, 26 Sep 2006 14:56:54 +0000</pubDate>
		<dc:creator>Brownspank</dc:creator>
				<category><![CDATA[CSS]]></category>
		<category><![CDATA[Design]]></category>
		<category><![CDATA[Typography]]></category>
		<category><![CDATA[Web]]></category>

		<guid isPermaLink="false">http://www.brownbatterystudios.com/sixthings/2006/09/26/there-is-hardship-beyond-arial-verdana/</guid>
		<description><![CDATA[Over the course of several recent projects, I&#8217;ve been experimenting with some alternatives to the usual cast of web fonts (Arial, Verdana, Georgia, etc.). I know this is nothing new, as countless other designers have had other fonts grace their designs. While the results of my experiments often prove less than successful, I proceed to [...]You might also like:<ol>
<li><a href='http://www.brownbatterystudios.com/sixthings/2007/03/14/lucida-hybrid-the-grande-alternative/' rel='bookmark' title='Lucida Hybrid: The &#8216;Grande&#8217; Alternative'>Lucida Hybrid: The &#8216;Grande&#8217; Alternative</a></li>
<li><a href='http://www.brownbatterystudios.com/sixthings/2008/04/01/are-vista-fonts-ready-for-the-web/' rel='bookmark' title='Are Vista Fonts Ready for the Web?'>Are Vista Fonts Ready for the Web?</a></li>
<li><a href='http://www.brownbatterystudios.com/sixthings/2009/02/18/lucida-hybrid-revisited/' rel='bookmark' title='Lucida Hybrid Revisited'>Lucida Hybrid Revisited</a></li>
</ol>]]></description>
		<wfw:commentRss>http://www.brownbatterystudios.com/sixthings/2006/09/26/there-is-hardship-beyond-arial-verdana/feed/</wfw:commentRss>
		<slash:comments>7</slash:comments>
		</item>
		<item>
		<title>An Even Better IE Button Width Fix</title>
		<link>http://www.brownbatterystudios.com/sixthings/2006/05/12/an-even-better-ie-button-width-fix/</link>
		<comments>http://www.brownbatterystudios.com/sixthings/2006/05/12/an-even-better-ie-button-width-fix/#comments</comments>
		<pubDate>Fri, 12 May 2006 07:42:36 +0000</pubDate>
		<dc:creator>Brownspank</dc:creator>
				<category><![CDATA[CSS]]></category>
		<category><![CDATA[Internet Explorer]]></category>
		<category><![CDATA[Web]]></category>

		<guid isPermaLink="false">http://www.brownbatterystudios.com/sixthings/2006/05/12/an-even-better-ie-button-width-fix/</guid>
		<description><![CDATA[Last time around, I went about writing an article documenting a revision for Jehiah&#8217;s IE Button Width Fix that would allow it to behave correctly, given a proper DOCTYPE. It worked well, with a minor downside that it required the use of IE conditional statements in your HTML to dish out the fix to just [...]You might also like:<ol>
<li><a href='http://www.brownbatterystudios.com/sixthings/2006/02/14/standards-friendly-ie-button-width-fix/' rel='bookmark' title='Standards-Friendly IE Button Width Fix'>Standards-Friendly IE Button Width Fix</a></li>
<li><a href='http://www.brownbatterystudios.com/sixthings/2006/04/25/maximize-css-comment-usage/' rel='bookmark' title='Maximize CSS Comment Usage'>Maximize CSS Comment Usage</a></li>
<li><a href='http://www.brownbatterystudios.com/sixthings/2011/04/25/css3-rounded-corners-avoiding-image-clipping-problems/' rel='bookmark' title='CSS3 Rounded Corners: Avoiding Image Clipping Problems'>CSS3 Rounded Corners: Avoiding Image Clipping Problems</a></li>
</ol>]]></description>
		<wfw:commentRss>http://www.brownbatterystudios.com/sixthings/2006/05/12/an-even-better-ie-button-width-fix/feed/</wfw:commentRss>
		<slash:comments>37</slash:comments>
		</item>
		<item>
		<title>Maximize CSS Comment Usage</title>
		<link>http://www.brownbatterystudios.com/sixthings/2006/04/25/maximize-css-comment-usage/</link>
		<comments>http://www.brownbatterystudios.com/sixthings/2006/04/25/maximize-css-comment-usage/#comments</comments>
		<pubDate>Tue, 25 Apr 2006 13:43:34 +0000</pubDate>
		<dc:creator>Brownspank</dc:creator>
				<category><![CDATA[CSS]]></category>

		<guid isPermaLink="false">http://www.brownbatterystudios.com/sixthings/2006/04/25/maximize-css-comment-usage/</guid>
		<description><![CDATA[I&#8217;ve been working on a couple of CSS layouts in the past few weeks and really got into using comments full blast. I also found some more interesting uses for CSS comments, aside from the usual authoring information and section markers. Most of you are probably doing these already, but I wanted to share them, [...]You might also like:<ol>
<li><a href='http://www.brownbatterystudios.com/sixthings/2006/03/21/css-code-visual-grouping-techniques/' rel='bookmark' title='CSS Code Visual Grouping Techniques'>CSS Code Visual Grouping Techniques</a></li>
<li><a href='http://www.brownbatterystudios.com/sixthings/2006/02/20/six-essential-firefox-extensions-for-web-designers/' rel='bookmark' title='Six Essential Firefox Extensions For Web Designers'>Six Essential Firefox Extensions For Web Designers</a></li>
<li><a href='http://www.brownbatterystudios.com/sixthings/2006/11/21/forming-effective-css-classes-ids/' rel='bookmark' title='Forming Effective CSS Classes &amp; IDs'>Forming Effective CSS Classes &#038; IDs</a></li>
</ol>]]></description>
		<wfw:commentRss>http://www.brownbatterystudios.com/sixthings/2006/04/25/maximize-css-comment-usage/feed/</wfw:commentRss>
		<slash:comments>20</slash:comments>
		</item>
	</channel>
</rss>

