<?xml version="1.0" encoding="utf-8"?>
<rss xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns:pingback="http://madskills.com/public/xml/rss/module/pingback/" xmlns:trackback="http://madskills.com/public/xml/rss/module/trackback/" xmlns:wfw="http://wellformedweb.org/CommentAPI/" xmlns:slash="http://purl.org/rss/1.0/modules/slash/" xmlns:dc="http://purl.org/dc/elements/1.1/" version="2.0">
  <channel>
    <title>freachable.net - HTML</title>
    <link>http://freachable.net/</link>
    <description>Next generation's garbage</description>
    <language>en-us</language>
    <copyright>Hafthor Stefansson</copyright>
    <lastBuildDate>Fri, 30 Jul 2010 06:54:30 GMT</lastBuildDate>
    <generator>newtelligence dasBlog 2.1.8102.813</generator>
    <managingEditor>blog@freachable.net</managingEditor>
    <webMaster>blog@freachable.net</webMaster>
    <item>
      <trackback:ping>http://freachable.net/Trackback.aspx?guid=37c4935a-7e5f-4e75-9979-7c5fa08a129e</trackback:ping>
      <pingback:server>http://freachable.net/pingback.aspx</pingback:server>
      <pingback:target>http://freachable.net/PermaLink,guid,37c4935a-7e5f-4e75-9979-7c5fa08a129e.aspx</pingback:target>
      <dc:creator>Hafthor Stefansson</dc:creator>
      <wfw:comment>http://freachable.net/CommentView,guid,37c4935a-7e5f-4e75-9979-7c5fa08a129e.aspx</wfw:comment>
      <wfw:commentRss>http://freachable.net/SyndicationService.asmx/GetEntryCommentsRss?guid=37c4935a-7e5f-4e75-9979-7c5fa08a129e</wfw:commentRss>
      <body xmlns="http://www.w3.org/1999/xhtml">Check this out.<br /><ul><li>
You know how on IE, you can't login to multiple GMail accounts at the same time? Well,
this browser can totally do that.</li><li>
Ever wish you could consolidate the chrome and get more real estate for browsing?
Well how about the menu bar, button bar and address bar all on one line?</li><li>
It doesn't have tabs, it's got super tabs. Ever try to view to pages at the same time
when you are using tabs? These tabs are each in their own moveable resizable window!</li><li>
Compatibility? This browser is probably the most compatible browser you can get. And
the developers are committed to it. More man hours are put toward this browser than
any other.</li><li>
Like that lolcat picture? Click a button that appears over the image to save it to
disk.<br /></li><li>
And it has other sweet little touches, like you know how when you hit F11 on IE it
leaves that stupid status bar at the bottom, leaving you to manually hide it and unhide
it when you are done? This browser cleverly hides it automatically and unhides it
for you when you are done with Theater mode.</li><li>
Price? It comes free with Windows XP.</li><li>
Not ready to try something new and untested? This browser has a bazillion miles on
it. It's over nine years old. IE6. The best 9 year-old browser on the planet.<br /></li></ul><p></p><img width="0" height="0" src="http://freachable.net/aggbug.ashx?id=37c4935a-7e5f-4e75-9979-7c5fa08a129e" /></body>
      <title>Awesome Browser</title>
      <guid isPermaLink="false">http://freachable.net/PermaLink,guid,37c4935a-7e5f-4e75-9979-7c5fa08a129e.aspx</guid>
      <link>http://freachable.net/2010/07/30/AwesomeBrowser.aspx</link>
      <pubDate>Fri, 30 Jul 2010 06:54:30 GMT</pubDate>
      <description>Check this out.&lt;br&gt;
&lt;ul&gt;
&lt;li&gt;
You know how on IE, you can't login to multiple GMail accounts at the same time? Well,
this browser can totally do that.&lt;/li&gt;
&lt;li&gt;
Ever wish you could consolidate the chrome and get more real estate for browsing?
Well how about the menu bar, button bar and address bar all on one line?&lt;/li&gt;
&lt;li&gt;
It doesn't have tabs, it's got super tabs. Ever try to view to pages at the same time
when you are using tabs? These tabs are each in their own moveable resizable window!&lt;/li&gt;
&lt;li&gt;
Compatibility? This browser is probably the most compatible browser you can get. And
the developers are committed to it. More man hours are put toward this browser than
any other.&lt;/li&gt;
&lt;li&gt;
Like that lolcat picture? Click a button that appears over the image to save it to
disk.&lt;br&gt;
&lt;/li&gt;
&lt;li&gt;
And it has other sweet little touches, like you know how when you hit F11 on IE it
leaves that stupid status bar at the bottom, leaving you to manually hide it and unhide
it when you are done? This browser cleverly hides it automatically and unhides it
for you when you are done with Theater mode.&lt;/li&gt;
&lt;li&gt;
Price? It comes free with Windows XP.&lt;/li&gt;
&lt;li&gt;
Not ready to try something new and untested? This browser has a bazillion miles on
it. It's over nine years old. IE6. The best 9 year-old browser on the planet.&lt;br&gt;
&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;
&lt;/p&gt;
&lt;img width="0" height="0" src="http://freachable.net/aggbug.ashx?id=37c4935a-7e5f-4e75-9979-7c5fa08a129e" /&gt;</description>
      <comments>http://freachable.net/CommentView,guid,37c4935a-7e5f-4e75-9979-7c5fa08a129e.aspx</comments>
      <category>HTML</category>
    </item>
    <item>
      <trackback:ping>http://freachable.net/Trackback.aspx?guid=8d67f8b6-b0e2-42c3-b28e-611c342a53f7</trackback:ping>
      <pingback:server>http://freachable.net/pingback.aspx</pingback:server>
      <pingback:target>http://freachable.net/PermaLink,guid,8d67f8b6-b0e2-42c3-b28e-611c342a53f7.aspx</pingback:target>
      <dc:creator>Hafthor Stefansson</dc:creator>
      <wfw:comment>http://freachable.net/CommentView,guid,8d67f8b6-b0e2-42c3-b28e-611c342a53f7.aspx</wfw:comment>
      <wfw:commentRss>http://freachable.net/SyndicationService.asmx/GetEntryCommentsRss?guid=8d67f8b6-b0e2-42c3-b28e-611c342a53f7</wfw:commentRss>
      <body xmlns="http://www.w3.org/1999/xhtml">I wanted rounded corners, but with minimal
fuss. I'm using border-radius and variants (-moz, -webkit, -khtml) which is great,
except for on IE, but I found a DHTML behavior (<a href="http://code.google.com/p/curved-corner/">http://code.google.com/p/curved-corner/</a>)
that makes it so IE will appear to have these powers. The trouble is, I'm using SiteFinity
which, like any good CMS, has these virtual folders that don't exist in IIS and url
references to behaviors must be in the same directory.<br /><br />
To fix this, I wrote a quick HttpHandler to all me to capture requests for htc files
and serve them from any path.<br /><br />
Here's the source:<br /><pre><span style="color: Black; background-color: Transparent; font-family: Courier New; font-size: 11px;"><span style="color: Blue; background-color: Transparent; font-family: Courier New; font-size: 11px;">public</span><span style="color: Blue; background-color: Transparent; font-family: Courier New; font-size: 11px;">class</span> HtcAnywhereHandler
: IHttpHandler { <span style="color: Blue; background-color: Transparent; font-family: Courier New; font-size: 11px;">public</span> HtcAnywhereHandler()
{ } <span style="color: Blue; background-color: Transparent; font-family: Courier New; font-size: 11px;">public</span><span style="color: Blue; background-color: Transparent; font-family: Courier New; font-size: 11px;">bool</span> IsReusable
{ get { <span style="color: Blue; background-color: Transparent; font-family: Courier New; font-size: 11px;">return</span><span style="color: Blue; background-color: Transparent; font-family: Courier New; font-size: 11px;">false</span>;
} } <span style="color: Blue; background-color: Transparent; font-family: Courier New; font-size: 11px;">public</span><span style="color: Blue; background-color: Transparent; font-family: Courier New; font-size: 11px;">void</span> ProcessRequest(HttpContext
context) { FileInfo fi <span style="color: Red; background-color: Transparent; font-family: Courier New; font-size: 11px;">=</span><span style="color: Blue; background-color: Transparent; font-family: Courier New; font-size: 11px;">new</span> FileInfo(context.Server.MapPath(<span style="color: rgb(102, 102, 102); background-color: rgb(228, 228, 228); font-family: Courier New; font-size: 11px;">"~/htc/"</span><span style="color: Red; background-color: Transparent; font-family: Courier New; font-size: 11px;">+</span> context.Request.Url.Segments[context.Request.Url.Segments.Length <span style="color: Red; background-color: Transparent; font-family: Courier New; font-size: 11px;">-</span> 1])); <span style="color: Blue; background-color: Transparent; font-family: Courier New; font-size: 11px;">if</span> (fi.Exists
&amp;&amp; fi.Extension.Equals(<span style="color: rgb(102, 102, 102); background-color: rgb(228, 228, 228); font-family: Courier New; font-size: 11px;">".htc"</span>,
System.StringComparison.InvariantCultureIgnoreCase)) { context.Response.ContentType <span style="color: Red; background-color: Transparent; font-family: Courier New; font-size: 11px;">=</span><span style="color: rgb(102, 102, 102); background-color: rgb(228, 228, 228); font-family: Courier New; font-size: 11px;">"text/x-component"</span>;
context.Response.BinaryWrite(File.ReadAllBytes(fi.FullName)); } <span style="color: Blue; background-color: Transparent; font-family: Courier New; font-size: 11px;">else</span> context.Response.StatusCode <span style="color: Red; background-color: Transparent; font-family: Courier New; font-size: 11px;">=</span> 404;
} }</span></pre>So now I have an /htc directory where I really store my behavior but
a request to /skljfsfcio/border-radius.htc will serve the /htc/border-radius.htc file.
Yay.<br /><br />
To make this work, you'll need to add an entry to the httpHandlers section in the
web.config<br /><br />
&lt;add verb="GET" path="*.htc" validate="false" type="HtcAnywhereHandler, HtcAnywhere"
/&gt;<br /><br />
Then you need to tell IIS to use ASP.NET for .htc files. Go to the web site properties,
Home Directory tab, [configuration...], add an application extension to C:\WINDOWS\Microsoft.NET\Framework\v2.0.50727\aspnet_isapi.dll
for .htc, Limit to: "GET", and turn off verify that it exists.<br /><br />
The bummer for me was that in my html that border-radius.htc didn't end up working.
Sigh.<br /><p></p><img width="0" height="0" src="http://freachable.net/aggbug.ashx?id=8d67f8b6-b0e2-42c3-b28e-611c342a53f7" /></body>
      <title>Using HTC Behaviors in SiteFinity or other ASP.NET CMS</title>
      <guid isPermaLink="false">http://freachable.net/PermaLink,guid,8d67f8b6-b0e2-42c3-b28e-611c342a53f7.aspx</guid>
      <link>http://freachable.net/2010/07/02/UsingHTCBehaviorsInSiteFinityOrOtherASPNETCMS.aspx</link>
      <pubDate>Fri, 02 Jul 2010 19:40:58 GMT</pubDate>
      <description>I wanted rounded corners, but with minimal fuss. I'm using border-radius and variants (-moz, -webkit, -khtml) which is great, except for on IE, but I found a DHTML behavior (&lt;a href="http://code.google.com/p/curved-corner/"&gt;http://code.google.com/p/curved-corner/&lt;/a&gt;)
that makes it so IE will appear to have these powers. The trouble is, I'm using SiteFinity
which, like any good CMS, has these virtual folders that don't exist in IIS and url
references to behaviors must be in the same directory.&lt;br&gt;
&lt;br&gt;
To fix this, I wrote a quick HttpHandler to all me to capture requests for htc files
and serve them from any path.&lt;br&gt;
&lt;br&gt;
Here's the source:&lt;br&gt;
&lt;pre&gt;&lt;span style="color: Black; background-color: Transparent; font-family: Courier New; font-size: 11px;"&gt; &lt;span style="color: Blue; background-color: Transparent; font-family: Courier New; font-size: 11px;"&gt;public&lt;/span&gt; &lt;span style="color: Blue; background-color: Transparent; font-family: Courier New; font-size: 11px;"&gt;class&lt;/span&gt; HtcAnywhereHandler
: IHttpHandler { &lt;span style="color: Blue; background-color: Transparent; font-family: Courier New; font-size: 11px;"&gt;public&lt;/span&gt; HtcAnywhereHandler()
{ } &lt;span style="color: Blue; background-color: Transparent; font-family: Courier New; font-size: 11px;"&gt;public&lt;/span&gt; &lt;span style="color: Blue; background-color: Transparent; font-family: Courier New; font-size: 11px;"&gt;bool&lt;/span&gt; IsReusable
{ get { &lt;span style="color: Blue; background-color: Transparent; font-family: Courier New; font-size: 11px;"&gt;return&lt;/span&gt; &lt;span style="color: Blue; background-color: Transparent; font-family: Courier New; font-size: 11px;"&gt;false&lt;/span&gt;;
} } &lt;span style="color: Blue; background-color: Transparent; font-family: Courier New; font-size: 11px;"&gt;public&lt;/span&gt; &lt;span style="color: Blue; background-color: Transparent; font-family: Courier New; font-size: 11px;"&gt;void&lt;/span&gt; ProcessRequest(HttpContext
context) { FileInfo fi &lt;span style="color: Red; background-color: Transparent; font-family: Courier New; font-size: 11px;"&gt;=&lt;/span&gt; &lt;span style="color: Blue; background-color: Transparent; font-family: Courier New; font-size: 11px;"&gt;new&lt;/span&gt; FileInfo(context.Server.MapPath(&lt;span style="color: rgb(102, 102, 102); background-color: rgb(228, 228, 228); font-family: Courier New; font-size: 11px;"&gt;"~/htc/"&lt;/span&gt; &lt;span style="color: Red; background-color: Transparent; font-family: Courier New; font-size: 11px;"&gt;+&lt;/span&gt; context.Request.Url.Segments[context.Request.Url.Segments.Length &lt;span style="color: Red; background-color: Transparent; font-family: Courier New; font-size: 11px;"&gt;-&lt;/span&gt; 1])); &lt;span style="color: Blue; background-color: Transparent; font-family: Courier New; font-size: 11px;"&gt;if&lt;/span&gt; (fi.Exists
&amp;amp;&amp;amp; fi.Extension.Equals(&lt;span style="color: rgb(102, 102, 102); background-color: rgb(228, 228, 228); font-family: Courier New; font-size: 11px;"&gt;".htc"&lt;/span&gt;,
System.StringComparison.InvariantCultureIgnoreCase)) { context.Response.ContentType &lt;span style="color: Red; background-color: Transparent; font-family: Courier New; font-size: 11px;"&gt;=&lt;/span&gt; &lt;span style="color: rgb(102, 102, 102); background-color: rgb(228, 228, 228); font-family: Courier New; font-size: 11px;"&gt;"text/x-component"&lt;/span&gt;;
context.Response.BinaryWrite(File.ReadAllBytes(fi.FullName)); } &lt;span style="color: Blue; background-color: Transparent; font-family: Courier New; font-size: 11px;"&gt;else&lt;/span&gt; context.Response.StatusCode &lt;span style="color: Red; background-color: Transparent; font-family: Courier New; font-size: 11px;"&gt;=&lt;/span&gt; 404;
} }&lt;/span&gt;&lt;/pre&gt;So now I have an /htc directory where I really store my behavior but
a request to /skljfsfcio/border-radius.htc will serve the /htc/border-radius.htc file.
Yay.&lt;br&gt;
&lt;br&gt;
To make this work, you'll need to add an entry to the httpHandlers section in the
web.config&lt;br&gt;
&lt;br&gt;
&amp;lt;add verb="GET" path="*.htc" validate="false" type="HtcAnywhereHandler, HtcAnywhere"
/&amp;gt;&lt;br&gt;
&lt;br&gt;
Then you need to tell IIS to use ASP.NET for .htc files. Go to the web site properties,
Home Directory tab, [configuration...], add an application extension to C:\WINDOWS\Microsoft.NET\Framework\v2.0.50727\aspnet_isapi.dll
for .htc, Limit to: "GET", and turn off verify that it exists.&lt;br&gt;
&lt;br&gt;
The bummer for me was that in my html that border-radius.htc didn't end up working.
Sigh.&lt;br&gt;
&lt;p&gt;
&lt;/p&gt;
&lt;img width="0" height="0" src="http://freachable.net/aggbug.ashx?id=8d67f8b6-b0e2-42c3-b28e-611c342a53f7" /&gt;</description>
      <comments>http://freachable.net/CommentView,guid,8d67f8b6-b0e2-42c3-b28e-611c342a53f7.aspx</comments>
      <category>.NET</category>
      <category>HTML</category>
      <category>SiteFinity</category>
    </item>
    <item>
      <trackback:ping>http://freachable.net/Trackback.aspx?guid=11669bd0-5762-4716-ba59-ca5956286407</trackback:ping>
      <pingback:server>http://freachable.net/pingback.aspx</pingback:server>
      <pingback:target>http://freachable.net/PermaLink,guid,11669bd0-5762-4716-ba59-ca5956286407.aspx</pingback:target>
      <dc:creator>Hafthor Stefansson</dc:creator>
      <wfw:comment>http://freachable.net/CommentView,guid,11669bd0-5762-4716-ba59-ca5956286407.aspx</wfw:comment>
      <wfw:commentRss>http://freachable.net/SyndicationService.asmx/GetEntryCommentsRss?guid=11669bd0-5762-4716-ba59-ca5956286407</wfw:commentRss>
      <body xmlns="http://www.w3.org/1999/xhtml">
        <p>
Got a new iPhone yesterday.
</p>
        <p>
Tried several times to download the new iPhone SDK -- can't get it.
</p>
        <p>
Running IE8 - I love what they did to the zoom feature, but other than that it pretty
much barfs on every web page anywhere.
</p>
        <img width="0" height="0" src="http://freachable.net/aggbug.ashx?id=11669bd0-5762-4716-ba59-ca5956286407" />
      </body>
      <title>iBrick, SDK, IE8</title>
      <guid isPermaLink="false">http://freachable.net/PermaLink,guid,11669bd0-5762-4716-ba59-ca5956286407.aspx</guid>
      <link>http://freachable.net/2008/03/07/iBrickSDKIE8.aspx</link>
      <pubDate>Fri, 07 Mar 2008 21:46:48 GMT</pubDate>
      <description>&lt;p&gt;
Got a new iPhone yesterday.
&lt;/p&gt;
&lt;p&gt;
Tried several times to download the new iPhone SDK -- can't get it.
&lt;/p&gt;
&lt;p&gt;
Running IE8 - I love what they did to the zoom feature, but other than that it pretty
much barfs on every web page anywhere.
&lt;/p&gt;
&lt;img width="0" height="0" src="http://freachable.net/aggbug.ashx?id=11669bd0-5762-4716-ba59-ca5956286407" /&gt;</description>
      <comments>http://freachable.net/CommentView,guid,11669bd0-5762-4716-ba59-ca5956286407.aspx</comments>
      <category>Hardware</category>
      <category>HTML</category>
    </item>
    <item>
      <trackback:ping>http://freachable.net/Trackback.aspx?guid=6b6a5194-cea8-4225-b23f-9362940a429b</trackback:ping>
      <pingback:server>http://freachable.net/pingback.aspx</pingback:server>
      <pingback:target>http://freachable.net/PermaLink,guid,6b6a5194-cea8-4225-b23f-9362940a429b.aspx</pingback:target>
      <dc:creator>Hafthor Stefansson</dc:creator>
      <wfw:comment>http://freachable.net/CommentView,guid,6b6a5194-cea8-4225-b23f-9362940a429b.aspx</wfw:comment>
      <wfw:commentRss>http://freachable.net/SyndicationService.asmx/GetEntryCommentsRss?guid=6b6a5194-cea8-4225-b23f-9362940a429b</wfw:commentRss>
      <body xmlns="http://www.w3.org/1999/xhtml">
        <p>
I recently built a webpart that, among other things, displays an image, but the webpart
really only generates the html to reference an image and it could not easily guarantee
that the image would be available and I wanted to show something better than a red
x.
</p>
        <p>
By using a little script on the 'onerror' attribute for the img tag, I was able to
reference a "image not available" picture in case the image failed to load.
</p>
        <p>
Here's an example:
</p>
        <p>
&lt;img src="maybethisworks.jpg" onerror="this.src='/notavailable.gif';" /&gt;
</p>
        <p>
That's it. It works on Opera9.5, Firefox2, IE7, Navigator9, and Safari3.
</p>
        <p>
Edit: I felt panic when I noticed that all my images where coming up with the not
available picture. After some flail I finally realized what was going on. The images
were in a checked-out state which means that if I was authenticated they would appear,
but if I was anonymous, they wouldn't and I would get the onerror behavior.
</p>
        <p>
BTW: For anyone needing to perform check-in on many files (which is what you get after
you upload a directory of images to a image library) you can use the "Manage Site
Content and Structure" feature of MOSS which will allow you to do a mass check in.
</p>
        <img width="0" height="0" src="http://freachable.net/aggbug.ashx?id=6b6a5194-cea8-4225-b23f-9362940a429b" />
      </body>
      <title>Using IMG onerror to do client side custom 404</title>
      <guid isPermaLink="false">http://freachable.net/PermaLink,guid,6b6a5194-cea8-4225-b23f-9362940a429b.aspx</guid>
      <link>http://freachable.net/2008/01/24/UsingIMGOnerrorToDoClientSideCustom404.aspx</link>
      <pubDate>Thu, 24 Jan 2008 23:02:45 GMT</pubDate>
      <description>&lt;p&gt;
I recently built a webpart that, among other things, displays an image, but the webpart
really only generates the html to reference an image and it could not easily guarantee
that the image would be available and I wanted to show something better than a red
x.
&lt;/p&gt;
&lt;p&gt;
By using a little script on the 'onerror' attribute for the img tag, I was able to
reference a "image not available" picture in case the image failed to load.
&lt;/p&gt;
&lt;p&gt;
Here's an example:
&lt;/p&gt;
&lt;p&gt;
&amp;lt;img src="maybethisworks.jpg" onerror="this.src='/notavailable.gif';" /&amp;gt;
&lt;/p&gt;
&lt;p&gt;
That's it. It works on Opera9.5, Firefox2, IE7, Navigator9, and Safari3.
&lt;/p&gt;
&lt;p&gt;
Edit: I felt panic when I noticed that all my images where coming up with the not
available picture. After some flail I finally realized what was going on. The images
were in a checked-out state which means that if I was authenticated they would appear,
but if I was anonymous, they wouldn't and I would get the onerror behavior.
&lt;/p&gt;
&lt;p&gt;
BTW: For anyone needing to perform check-in on many files (which is what you get after
you upload a directory of images to a image library) you can use the "Manage Site
Content and Structure" feature of MOSS which will allow you to do a mass check in.
&lt;/p&gt;
&lt;img width="0" height="0" src="http://freachable.net/aggbug.ashx?id=6b6a5194-cea8-4225-b23f-9362940a429b" /&gt;</description>
      <comments>http://freachable.net/CommentView,guid,6b6a5194-cea8-4225-b23f-9362940a429b.aspx</comments>
      <category>HTML</category>
    </item>
    <item>
      <trackback:ping>http://freachable.net/Trackback.aspx?guid=b4e37a02-d21d-46b9-ab7f-6e6d16232dc2</trackback:ping>
      <pingback:server>http://freachable.net/pingback.aspx</pingback:server>
      <pingback:target>http://freachable.net/PermaLink,guid,b4e37a02-d21d-46b9-ab7f-6e6d16232dc2.aspx</pingback:target>
      <dc:creator>Hafthor Stefansson</dc:creator>
      <wfw:comment>http://freachable.net/CommentView,guid,b4e37a02-d21d-46b9-ab7f-6e6d16232dc2.aspx</wfw:comment>
      <wfw:commentRss>http://freachable.net/SyndicationService.asmx/GetEntryCommentsRss?guid=b4e37a02-d21d-46b9-ab7f-6e6d16232dc2</wfw:commentRss>
      <body xmlns="http://www.w3.org/1999/xhtml">
        <p>
Yes, yes, I hear you anti-table zealots, but this is cool. (I'll have to blog my thoughts
about this someday, along with the other religious argument about nothing but stored
procedures accessible to code.)
</p>
        <p>
Scenario: You have a table that will have <em>n</em> columns, where <em>n</em> is
determined at run time and you want the columns to have equal width, for example,
a table that is 100px wide with 4 columns should render 25px wide columns, 5 wide,
20px.
</p>
        <p>
Why is this useful? SharePoint or ASP.NET SitePath menus.
</p>
        <p>
Here's how:
</p>
        <p>
table tr td { width:5%; }
</p>
        <p>
When the table renders and sums up the 5%s and gets only 20 or 25% total, it scales
that up to be 100% and the cell width percentage scales up with it.
</p>
        <p>
see it at <a href="http://hafthor.com/equalwidthtables.html">http://hafthor.com/equalwidthtables.html</a></p>
        <p>
I haven't tested this non-quirks mode, but it does work in FireFox and IE7.
</p>
        <p>
[Edit 2007-11-04] I have tested this in xhtml strict mode (IE7 and FireFox) - it still
works.
</p>
        <p>
see it at <a href="http://hafthor.com/tricks.html">http://hafthor.com/tricks.html</a></p>
        <p>
[Edit 2007-11-05] Dang. FireFox doesn't render this the way I wanted when in xhtml
strict mode. The issue wasn't apparent until the overall width wasn't really wide.
But, I tried those pages on iPhone Safari and they looked okay.
</p>
        <img width="0" height="0" src="http://freachable.net/aggbug.ashx?id=b4e37a02-d21d-46b9-ab7f-6e6d16232dc2" />
      </body>
      <title>Automatic Equal Width Columns in HTML Tables</title>
      <guid isPermaLink="false">http://freachable.net/PermaLink,guid,b4e37a02-d21d-46b9-ab7f-6e6d16232dc2.aspx</guid>
      <link>http://freachable.net/2007/11/02/AutomaticEqualWidthColumnsInHTMLTables.aspx</link>
      <pubDate>Fri, 02 Nov 2007 21:30:28 GMT</pubDate>
      <description>&lt;p&gt;
Yes, yes, I hear you anti-table zealots, but this is cool. (I'll have to blog my thoughts
about this someday, along with the other religious argument about nothing but stored
procedures accessible to code.)
&lt;/p&gt;
&lt;p&gt;
Scenario: You have a table that will have &lt;em&gt;n&lt;/em&gt; columns, where &lt;em&gt;n&lt;/em&gt; is
determined at run time and you want the columns to have equal width, for example,
a table that is 100px wide with 4 columns should render 25px wide columns, 5 wide,
20px.
&lt;/p&gt;
&lt;p&gt;
Why is this useful? SharePoint or ASP.NET SitePath menus.
&lt;/p&gt;
&lt;p&gt;
Here's how:
&lt;/p&gt;
&lt;p&gt;
table tr td { width:5%; }
&lt;/p&gt;
&lt;p&gt;
When the table renders and sums up the 5%s and gets only 20 or 25% total, it scales
that up to be 100% and the cell width percentage scales up with it.
&lt;/p&gt;
&lt;p&gt;
see it at &lt;a href="http://hafthor.com/equalwidthtables.html"&gt;http://hafthor.com/equalwidthtables.html&lt;/a&gt;
&lt;/p&gt;
&lt;p&gt;
I haven't tested this non-quirks mode, but it does work in FireFox and IE7.
&lt;/p&gt;
&lt;p&gt;
[Edit 2007-11-04] I have tested this in xhtml strict mode (IE7 and FireFox) - it still
works.
&lt;/p&gt;
&lt;p&gt;
see it at &lt;a href="http://hafthor.com/tricks.html"&gt;http://hafthor.com/tricks.html&lt;/a&gt;
&lt;/p&gt;
&lt;p&gt;
[Edit 2007-11-05] Dang. FireFox doesn't render this the way I wanted when in xhtml
strict mode. The issue wasn't apparent until the overall width wasn't really wide.
But, I tried those pages on iPhone Safari and they looked okay.
&lt;/p&gt;
&lt;img width="0" height="0" src="http://freachable.net/aggbug.ashx?id=b4e37a02-d21d-46b9-ab7f-6e6d16232dc2" /&gt;</description>
      <comments>http://freachable.net/CommentView,guid,b4e37a02-d21d-46b9-ab7f-6e6d16232dc2.aspx</comments>
      <category>HTML</category>
      <category>SharePoint</category>
    </item>
    <item>
      <trackback:ping>http://freachable.net/Trackback.aspx?guid=5d68a7c6-61eb-4003-ba0a-55061b180583</trackback:ping>
      <pingback:server>http://freachable.net/pingback.aspx</pingback:server>
      <pingback:target>http://freachable.net/PermaLink,guid,5d68a7c6-61eb-4003-ba0a-55061b180583.aspx</pingback:target>
      <dc:creator>Hafthor Stefansson</dc:creator>
      <wfw:comment>http://freachable.net/CommentView,guid,5d68a7c6-61eb-4003-ba0a-55061b180583.aspx</wfw:comment>
      <wfw:commentRss>http://freachable.net/SyndicationService.asmx/GetEntryCommentsRss?guid=5d68a7c6-61eb-4003-ba0a-55061b180583</wfw:commentRss>
      <body xmlns="http://www.w3.org/1999/xhtml">
        <p>
The <a href="http://freachable.net/2007/10/18/WelcomeToFreachablenetBloggingWithWord2007OnDasBlogOnGoDaddy.aspx">first
blog entry</a> I made, initially, had a float clear problem. DasBlog apparently doesn't
clear floats from the HTML entry contents in the crazy manner needed to appease the
IE quirks gods. See <a href="http://www.positioniseverything.net/easyclearing.html">http://www.positioniseverything.net/easyclearing.html</a>.
</p>
        <p>
The problem should be evident on this page:
</p>
        <p>
          <a href="http://hafthor.com/floatclear.htm">http://hafthor.com/floatclear.htm</a>
        </p>
        <p>
scroll down far enough on IE and you should see the text of the article disappear.
This appears to happen because the align=right img floats lower than text. If you
don't see that behavior, the image at the end of this article shows the effect. After
posting the original article, I moved the image up to avoid this problem. But I wanted
to see if I could fix it. Maybe...
</p>
        <p>
          <a href="http://hafthor.com/floatclear2.htm">http://hafthor.com/floatclear2.htm</a>
        </p>
        <p>
I simply added this to the theme.css
</p>
        <blockquote dir="ltr" style="MARGIN-RIGHT: 0px">
          <p>
.itemBodyStyle:after {<br />
    content: "."; 
<br />
    display: block; 
<br />
    height: 0; 
<br />
    clear: both; 
<br />
    visibility: hidden;<br />
}
</p>
          <p>
.itemBodyStyle {display: inline-block;}
</p>
          <p>
/* Hides from IE-mac \*/<br />
* html .itemBodyStyle {height: 1%;}<br />
.itemBodyStyle {display: block;}<br />
/* End hide from IE-mac */
</p>
        </blockquote>
        <p>
and got rid of the &lt;div style="clear:both;" /&gt; business from the itemTemplate.blogtemplate.
</p>
        <p>
If this works right, I shouldn't have the float problem on this post.<img src="http://hafthor.com/floatclearani.gif" align="right" /></p>
        <p>
Edit: Yes, but it doesn't work quite right when shown in RSS Bandit.
</p>
        <p>
Edit: But if I place a &lt;div style="clear:both" /&gt; at the end of the
blog article html, it shows up correctly. Hmmm...
</p>
        <div style="CLEAR: both">
        </div>
        <img width="0" height="0" src="http://freachable.net/aggbug.ashx?id=5d68a7c6-61eb-4003-ba0a-55061b180583" />
      </body>
      <title>Sorry, I was clearing my float...</title>
      <guid isPermaLink="false">http://freachable.net/PermaLink,guid,5d68a7c6-61eb-4003-ba0a-55061b180583.aspx</guid>
      <link>http://freachable.net/2007/10/18/SorryIWasClearingMyFloat.aspx</link>
      <pubDate>Thu, 18 Oct 2007 09:25:02 GMT</pubDate>
      <description>&lt;p&gt;
The &lt;a href="http://freachable.net/2007/10/18/WelcomeToFreachablenetBloggingWithWord2007OnDasBlogOnGoDaddy.aspx"&gt;first
blog entry&lt;/a&gt; I made, initially, had a float clear problem. DasBlog apparently doesn't
clear floats from the HTML entry contents in the crazy manner needed to appease the
IE quirks gods. See &lt;a href="http://www.positioniseverything.net/easyclearing.html"&gt;http://www.positioniseverything.net/easyclearing.html&lt;/a&gt;.
&lt;/p&gt;
&lt;p&gt;
The problem should be evident on this page:
&lt;/p&gt;
&lt;p&gt;
&lt;a href="http://hafthor.com/floatclear.htm"&gt;http://hafthor.com/floatclear.htm&lt;/a&gt;
&lt;/p&gt;
&lt;p&gt;
scroll down far enough on IE and you should see the text of the article disappear.
This appears to happen because the align=right img floats lower than text. If you
don't see that behavior, the image at the end of this article shows the effect. After
posting the original article, I moved the image up to avoid this problem. But I wanted
to see if I could fix it. Maybe...
&lt;/p&gt;
&lt;p&gt;
&lt;a href="http://hafthor.com/floatclear2.htm"&gt;http://hafthor.com/floatclear2.htm&lt;/a&gt;
&lt;/p&gt;
&lt;p&gt;
I simply added this to the theme.css
&lt;/p&gt;
&lt;blockquote dir=ltr style="MARGIN-RIGHT: 0px"&gt; 
&lt;p&gt;
.itemBodyStyle:after {&lt;br&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp; content: "."; 
&lt;br&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp; display: block; 
&lt;br&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp; height: 0; 
&lt;br&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp; clear: both; 
&lt;br&gt;
&amp;nbsp;&amp;nbsp;&amp;nbsp; visibility: hidden;&lt;br&gt;
}
&lt;/p&gt;
&lt;p&gt;
.itemBodyStyle {display: inline-block;}
&lt;/p&gt;
&lt;p&gt;
/* Hides from IE-mac \*/&lt;br&gt;
* html .itemBodyStyle {height: 1%;}&lt;br&gt;
.itemBodyStyle {display: block;}&lt;br&gt;
/* End hide from IE-mac */
&lt;/p&gt;
&lt;/blockquote&gt; 
&lt;p&gt;
and got rid of the &amp;lt;div style="clear:both;" /&amp;gt; business from the itemTemplate.blogtemplate.
&lt;/p&gt;
&lt;p&gt;
If this works right, I shouldn't have the float problem on this post.&lt;img src="http://hafthor.com/floatclearani.gif" align=right&gt;
&lt;/p&gt;
&lt;p&gt;
Edit: Yes, but it doesn't work quite right when shown in RSS Bandit.
&lt;/p&gt;
&lt;p&gt;
Edit: But if I place a&amp;nbsp;&amp;lt;div style="clear:both" /&amp;gt;&amp;nbsp;at the end of the
blog article html, it shows up correctly. Hmmm...
&lt;/p&gt;
&lt;div style="CLEAR: both"&gt;
&lt;/div&gt;
&lt;img width="0" height="0" src="http://freachable.net/aggbug.ashx?id=5d68a7c6-61eb-4003-ba0a-55061b180583" /&gt;</description>
      <comments>http://freachable.net/CommentView,guid,5d68a7c6-61eb-4003-ba0a-55061b180583.aspx</comments>
      <category>dasBlog</category>
      <category>HTML</category>
    </item>
  </channel>
</rss>