<?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>Ace on Tech &#187; xhtml</title>
	<atom:link href="http://aceontech.com/tag/xhtml/feed/" rel="self" type="application/rss+xml" />
	<link>http://aceontech.com</link>
	<description>Design Intentionally Left Out</description>
	<lastBuildDate>Mon, 30 Aug 2010 05:14:24 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.0.1</generator>
		<item>
		<title>CSS: Strip Away all Styling</title>
		<link>http://aceontech.com/2008/01/18/css-strip-away-all-styling/</link>
		<comments>http://aceontech.com/2008/01/18/css-strip-away-all-styling/#comments</comments>
		<pubDate>Fri, 18 Jan 2008 22:33:19 +0000</pubDate>
		<dc:creator>Ace</dc:creator>
				<category><![CDATA[design]]></category>
		<category><![CDATA[initialization]]></category>
		<category><![CDATA[nullification]]></category>
		<category><![CDATA[web]]></category>
		<category><![CDATA[xhtml]]></category>

		<guid isPermaLink="false">http://www.ace-on-tech.com/2008/01/18/css-strip-away-all-styling/</guid>
		<description><![CDATA[Every browser has its own set of default styling for web pages. In case a particular website doesn&#8217;t provide enough styling for a certain element, it applies these instead. The differences between browsers can result into unforeseen results. A good &#8230; <a href="http://aceontech.com/2008/01/18/css-strip-away-all-styling/">Continue reading <span class="meta-nav">&#8594;</span></a>]]></description>
			<content:encoded><![CDATA[<p>Every browser has its own set of default styling for web pages. In case a particular website doesn&#8217;t provide enough styling for a certain element, it applies these instead. The differences between browsers can result into unforeseen results. A good example of this behavior is the difference in margins and paddings defined for lists (&lt;ul&gt;, &lt;ol&gt;, &lt;dl&gt;).</p>
<p>One technique you could use is:</p>
<pre language="CSS" line="1">* {
	margin: 0; padding: 0;
} </pre>
<p>Yes, this will neutralize everything to 0 margin and padding, but it&#8217;ll also have its effects on headings, forms, blockquotes, etc. Everything will be aligned crisply to the left side of the page, while this may not entirely be your intention.</p>
<pre language="CSS" line="1">@charset &quot;utf-8&quot;;
/*-- Initialization Stylesheet --*/

/* v2.1, by Faruk Ates - www.kurafire.net
   Addendum by Robert Nyman - www.robertnyman.com */

/* Neutralize styling:
   Elements we want to clean out entirely: */
html, body, form, fieldset {
	margin: 0;
	padding: 0;
	font: medium Calibri, Arial, Verdana, Helvetica, sans-serif;
}

/* Neutralize styling:
   Elements with a vertical margin: */
h1, h2, h3, h4, h5, h6, p, pre,
blockquote, ul, ol, dl, address {
	margin: 0;
	padding: 0;
}

/* Apply left margin:
   Only to the few elements that need it: */
li, dd, blockquote {
	margin-left: 1em;
}

/* Miscellaneous conveniences: */
form label {
	cursor: pointer;
}
fieldset {
	border: none;
}

/* Form field text-scaling */
input, select, textarea {
	font-size: 100%;
}</pre>
<p><a href="http://www.addtoany.com/add_to/twitter?linkurl=http%3A%2F%2Faceontech.com%2F2008%2F01%2F18%2Fcss-strip-away-all-styling%2F&amp;linkname=CSS%3A%20Strip%20Away%20all%20Styling" title="Twitter" rel="nofollow" target="_blank"><img src="http://aceontech.com/wp-content/plugins/add-to-any/icons/twitter.png" width="16" height="16" alt="Twitter"/></a> <a href="http://www.addtoany.com/add_to/slashdot?linkurl=http%3A%2F%2Faceontech.com%2F2008%2F01%2F18%2Fcss-strip-away-all-styling%2F&amp;linkname=CSS%3A%20Strip%20Away%20all%20Styling" title="Slashdot" rel="nofollow" target="_blank"><img src="http://aceontech.com/wp-content/plugins/add-to-any/icons/slashdot.png" width="16" height="16" alt="Slashdot"/></a> <a href="http://www.addtoany.com/add_to/instapaper?linkurl=http%3A%2F%2Faceontech.com%2F2008%2F01%2F18%2Fcss-strip-away-all-styling%2F&amp;linkname=CSS%3A%20Strip%20Away%20all%20Styling" title="Instapaper" rel="nofollow" target="_blank"><img src="http://aceontech.com/wp-content/plugins/add-to-any/icons/instapaper.png" width="16" height="16" alt="Instapaper"/></a> <a href="http://www.addtoany.com/add_to/digg?linkurl=http%3A%2F%2Faceontech.com%2F2008%2F01%2F18%2Fcss-strip-away-all-styling%2F&amp;linkname=CSS%3A%20Strip%20Away%20all%20Styling" title="Digg" rel="nofollow" target="_blank"><img src="http://aceontech.com/wp-content/plugins/add-to-any/icons/digg.png" width="16" height="16" alt="Digg"/></a> <a href="http://www.addtoany.com/add_to/facebook?linkurl=http%3A%2F%2Faceontech.com%2F2008%2F01%2F18%2Fcss-strip-away-all-styling%2F&amp;linkname=CSS%3A%20Strip%20Away%20all%20Styling" title="Facebook" rel="nofollow" target="_blank"><img src="http://aceontech.com/wp-content/plugins/add-to-any/icons/facebook.png" width="16" height="16" alt="Facebook"/></a> <a href="http://www.addtoany.com/add_to/mixx?linkurl=http%3A%2F%2Faceontech.com%2F2008%2F01%2F18%2Fcss-strip-away-all-styling%2F&amp;linkname=CSS%3A%20Strip%20Away%20all%20Styling" title="Mixx" rel="nofollow" target="_blank"><img src="http://aceontech.com/wp-content/plugins/add-to-any/icons/mixx.png" width="16" height="16" alt="Mixx"/></a> <a href="http://www.addtoany.com/add_to/delicious?linkurl=http%3A%2F%2Faceontech.com%2F2008%2F01%2F18%2Fcss-strip-away-all-styling%2F&amp;linkname=CSS%3A%20Strip%20Away%20all%20Styling" title="Delicious" rel="nofollow" target="_blank"><img src="http://aceontech.com/wp-content/plugins/add-to-any/icons/delicious.png" width="16" height="16" alt="Delicious"/></a> <a href="http://www.addtoany.com/add_to/reddit?linkurl=http%3A%2F%2Faceontech.com%2F2008%2F01%2F18%2Fcss-strip-away-all-styling%2F&amp;linkname=CSS%3A%20Strip%20Away%20all%20Styling" title="Reddit" rel="nofollow" target="_blank"><img src="http://aceontech.com/wp-content/plugins/add-to-any/icons/reddit.png" width="16" height="16" alt="Reddit"/></a> <a href="http://www.addtoany.com/add_to/friendfeed?linkurl=http%3A%2F%2Faceontech.com%2F2008%2F01%2F18%2Fcss-strip-away-all-styling%2F&amp;linkname=CSS%3A%20Strip%20Away%20all%20Styling" title="FriendFeed" rel="nofollow" target="_blank"><img src="http://aceontech.com/wp-content/plugins/add-to-any/icons/friendfeed.png" width="16" height="16" alt="FriendFeed"/></a> <a href="http://www.addtoany.com/add_to/google_buzz?linkurl=http%3A%2F%2Faceontech.com%2F2008%2F01%2F18%2Fcss-strip-away-all-styling%2F&amp;linkname=CSS%3A%20Strip%20Away%20all%20Styling" title="Google Buzz" rel="nofollow" target="_blank"><img src="http://aceontech.com/wp-content/plugins/add-to-any/icons/google_buzz.png" width="16" height="16" alt="Google Buzz"/></a> <a href="http://www.addtoany.com/add_to/stumbleupon?linkurl=http%3A%2F%2Faceontech.com%2F2008%2F01%2F18%2Fcss-strip-away-all-styling%2F&amp;linkname=CSS%3A%20Strip%20Away%20all%20Styling" title="StumbleUpon" rel="nofollow" target="_blank"><img src="http://aceontech.com/wp-content/plugins/add-to-any/icons/stumbleupon.png" width="16" height="16" alt="StumbleUpon"/></a> <a href="http://www.addtoany.com/add_to/evernote?linkurl=http%3A%2F%2Faceontech.com%2F2008%2F01%2F18%2Fcss-strip-away-all-styling%2F&amp;linkname=CSS%3A%20Strip%20Away%20all%20Styling" title="Evernote" rel="nofollow" target="_blank"><img src="http://aceontech.com/wp-content/plugins/add-to-any/icons/evernote.png" width="16" height="16" alt="Evernote"/></a> <a class="a2a_dd addtoany_share_save" href="http://www.addtoany.com/share_save"><img src="http://aceontech.com/wp-content/plugins/add-to-any/share_save_171_16.png" width="171" height="16" alt="Share/Bookmark"/></a> </p>]]></content:encoded>
			<wfw:commentRss>http://aceontech.com/2008/01/18/css-strip-away-all-styling/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Flash in XHTML 1.0 Strict</title>
		<link>http://aceontech.com/2007/01/22/flash-in-xhtml-10-strict/</link>
		<comments>http://aceontech.com/2007/01/22/flash-in-xhtml-10-strict/#comments</comments>
		<pubDate>Mon, 22 Jan 2007 08:25:51 +0000</pubDate>
		<dc:creator>Ace</dc:creator>
				<category><![CDATA[development]]></category>
		<category><![CDATA[web]]></category>
		<category><![CDATA[xhtml]]></category>

		<guid isPermaLink="false">http://www.ace-on-tech.com/2007/01/22/flash-in-xhtml-10-strict/</guid>
		<description><![CDATA[Ever tried to insert a flash animation into a valid XHTML webpage? I certainly have, and it always breaks your markup. The standard markup flash uses to render its animations stems from an ancient era of semantically misused tags and &#8230; <a href="http://aceontech.com/2007/01/22/flash-in-xhtml-10-strict/">Continue reading <span class="meta-nav">&#8594;</span></a>]]></description>
			<content:encoded><![CDATA[<p>Ever tried to insert a flash animation into a valid <span class="caps">XHTML</span> webpage? I certainly have, and it always breaks your markup. The standard markup flash uses to render its animations stems from an ancient era of semantically misused tags and properties. There must be a better way, I hope…</p>
<p>Several methods have independently been developed, each with their own benefits. There are two major techniques to choose from: the first being the “Flash Satay” method, the other <em>kinda</em> remains nameless. Let’s start with the Satay method.</p>
<h4>Flash Satay</h4>
<p>The full directives are listed at the notorious <a href="http://www.alistapart.com/articles/flashsatay/">A List Apart</a>  website.</p>
<p>In short, this method basically incorporates a container movie, into which you load the actual animation, preserving your content, with a friendly wrapper. This produces fairly nice markup, but it’s kind of a hassling experience — nonetheless effective.</p>
<h4>The other method</h4>
<p>The other technique uses the omni-valid tag called “object”, which is recognized by [nearly] all major browsers. No container file is used: you provide the user with an image containing a friendly error message. This is the way I do things. It’s a clean thing to do, but leaves a white backdrop on transparent framed flash movies (like those from YouTube). I’m certain there’s a way to cure this, but I haven’t had the (uhm) chance to look into it yet.</p>
<p><code>&lt;object type="application/x-shockwave-flash" data="yourflash.swf" width="288" height="128"&gt; &lt;param name="movie" value="images/banner.swf" /&gt; &lt;img src="error.gif" width="288" height="128" alt="banner" /&gt; &lt;/object&gt;</code></p>
<p>Either path you choose, there are always drawbacks. For instance, when a visitor doesn’t already have Flash installed, he/she <strong>will not</strong> get a direct link to Adobe’s website (unless you make the effort of defining it yourself). Nevertheless, standards compliance is the way to go, although I know we’d all appreciate an out-of-the box solution — someday soon.</p>
<p><a href="http://www.addtoany.com/add_to/twitter?linkurl=http%3A%2F%2Faceontech.com%2F2007%2F01%2F22%2Fflash-in-xhtml-10-strict%2F&amp;linkname=Flash%20in%20XHTML%201.0%20Strict" title="Twitter" rel="nofollow" target="_blank"><img src="http://aceontech.com/wp-content/plugins/add-to-any/icons/twitter.png" width="16" height="16" alt="Twitter"/></a> <a href="http://www.addtoany.com/add_to/slashdot?linkurl=http%3A%2F%2Faceontech.com%2F2007%2F01%2F22%2Fflash-in-xhtml-10-strict%2F&amp;linkname=Flash%20in%20XHTML%201.0%20Strict" title="Slashdot" rel="nofollow" target="_blank"><img src="http://aceontech.com/wp-content/plugins/add-to-any/icons/slashdot.png" width="16" height="16" alt="Slashdot"/></a> <a href="http://www.addtoany.com/add_to/instapaper?linkurl=http%3A%2F%2Faceontech.com%2F2007%2F01%2F22%2Fflash-in-xhtml-10-strict%2F&amp;linkname=Flash%20in%20XHTML%201.0%20Strict" title="Instapaper" rel="nofollow" target="_blank"><img src="http://aceontech.com/wp-content/plugins/add-to-any/icons/instapaper.png" width="16" height="16" alt="Instapaper"/></a> <a href="http://www.addtoany.com/add_to/digg?linkurl=http%3A%2F%2Faceontech.com%2F2007%2F01%2F22%2Fflash-in-xhtml-10-strict%2F&amp;linkname=Flash%20in%20XHTML%201.0%20Strict" title="Digg" rel="nofollow" target="_blank"><img src="http://aceontech.com/wp-content/plugins/add-to-any/icons/digg.png" width="16" height="16" alt="Digg"/></a> <a href="http://www.addtoany.com/add_to/facebook?linkurl=http%3A%2F%2Faceontech.com%2F2007%2F01%2F22%2Fflash-in-xhtml-10-strict%2F&amp;linkname=Flash%20in%20XHTML%201.0%20Strict" title="Facebook" rel="nofollow" target="_blank"><img src="http://aceontech.com/wp-content/plugins/add-to-any/icons/facebook.png" width="16" height="16" alt="Facebook"/></a> <a href="http://www.addtoany.com/add_to/mixx?linkurl=http%3A%2F%2Faceontech.com%2F2007%2F01%2F22%2Fflash-in-xhtml-10-strict%2F&amp;linkname=Flash%20in%20XHTML%201.0%20Strict" title="Mixx" rel="nofollow" target="_blank"><img src="http://aceontech.com/wp-content/plugins/add-to-any/icons/mixx.png" width="16" height="16" alt="Mixx"/></a> <a href="http://www.addtoany.com/add_to/delicious?linkurl=http%3A%2F%2Faceontech.com%2F2007%2F01%2F22%2Fflash-in-xhtml-10-strict%2F&amp;linkname=Flash%20in%20XHTML%201.0%20Strict" title="Delicious" rel="nofollow" target="_blank"><img src="http://aceontech.com/wp-content/plugins/add-to-any/icons/delicious.png" width="16" height="16" alt="Delicious"/></a> <a href="http://www.addtoany.com/add_to/reddit?linkurl=http%3A%2F%2Faceontech.com%2F2007%2F01%2F22%2Fflash-in-xhtml-10-strict%2F&amp;linkname=Flash%20in%20XHTML%201.0%20Strict" title="Reddit" rel="nofollow" target="_blank"><img src="http://aceontech.com/wp-content/plugins/add-to-any/icons/reddit.png" width="16" height="16" alt="Reddit"/></a> <a href="http://www.addtoany.com/add_to/friendfeed?linkurl=http%3A%2F%2Faceontech.com%2F2007%2F01%2F22%2Fflash-in-xhtml-10-strict%2F&amp;linkname=Flash%20in%20XHTML%201.0%20Strict" title="FriendFeed" rel="nofollow" target="_blank"><img src="http://aceontech.com/wp-content/plugins/add-to-any/icons/friendfeed.png" width="16" height="16" alt="FriendFeed"/></a> <a href="http://www.addtoany.com/add_to/google_buzz?linkurl=http%3A%2F%2Faceontech.com%2F2007%2F01%2F22%2Fflash-in-xhtml-10-strict%2F&amp;linkname=Flash%20in%20XHTML%201.0%20Strict" title="Google Buzz" rel="nofollow" target="_blank"><img src="http://aceontech.com/wp-content/plugins/add-to-any/icons/google_buzz.png" width="16" height="16" alt="Google Buzz"/></a> <a href="http://www.addtoany.com/add_to/stumbleupon?linkurl=http%3A%2F%2Faceontech.com%2F2007%2F01%2F22%2Fflash-in-xhtml-10-strict%2F&amp;linkname=Flash%20in%20XHTML%201.0%20Strict" title="StumbleUpon" rel="nofollow" target="_blank"><img src="http://aceontech.com/wp-content/plugins/add-to-any/icons/stumbleupon.png" width="16" height="16" alt="StumbleUpon"/></a> <a href="http://www.addtoany.com/add_to/evernote?linkurl=http%3A%2F%2Faceontech.com%2F2007%2F01%2F22%2Fflash-in-xhtml-10-strict%2F&amp;linkname=Flash%20in%20XHTML%201.0%20Strict" title="Evernote" rel="nofollow" target="_blank"><img src="http://aceontech.com/wp-content/plugins/add-to-any/icons/evernote.png" width="16" height="16" alt="Evernote"/></a> <a class="a2a_dd addtoany_share_save" href="http://www.addtoany.com/share_save"><img src="http://aceontech.com/wp-content/plugins/add-to-any/share_save_171_16.png" width="171" height="16" alt="Share/Bookmark"/></a> </p>]]></content:encoded>
			<wfw:commentRss>http://aceontech.com/2007/01/22/flash-in-xhtml-10-strict/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>
