February 2012 in the Life of Ben (Blog)

  1. January
  2. February
  3. March
  4. April
  5. May
  6. June
  7. July
  8. August
  9. September
  10. October
  11. November
  12. December

Off-Grid and On-Piste (25th February 2012)

Fiona and I leave for our holiday this afternoon. I’ll be off-grid and on-piste from 26th February 2012 until 4th March 2012.

Our previous trip is captured in Skiing Holiday in Morzine, France from March 2011.

Au revoir!

Laptop: FTPuse Integrates Seamlessly? (16th February 2012)

Today I finally got fed up with using Windows Explorer as an FTP client. After just a couple of searches I found you can map an FTP server to a drive letter. That page has an animated GIF showing how it works. Finally, the OS-integrated experience I crave for FTP might be possible!

Uninstalled due to Even Worse Lag (22nd April 2012)

It was awesome to see proper icons. And have the Explorer folder panel work properly in the sidebar. And have folder settings set throughout the entire folder tree by setting them once on the root, instead of them only being remembered in folders where they are specifically set.

But it was so, so slow. The reason I keep coming back to Windows Explorer as an FTP client is the epic convenience and speed. Drag from where I’m working and drop into the folder I want it to go.

So far, in my book, Windows Explorer remains unbeaten.

Column Layout With inline-block (16th February 2012)

Each year fills one column on my archive of all blog entries. It used to be a 4-column percentage layout using float. Now it uses inline-block so the number of columns adapts to the available area. This way even takes slightly less HTML, CSS and back-end code!

New inline-block Technique

The relevant HTML: 

<div><h2>2003</h2>…</div>
<div><h2>2004</h2>…</div>
<div><h2>2005</h2>…</div>
<div><h2>2006</h2>…</div>
<div><h2>2007</h2>…</div>
<div><h2>2008</h2>…</div>
<div><h2>2009</h2>…</div>
<div><h2>2010</h2>…</div>
<div><h2>2011</h2>…</div>
<div><h2>2012</h2>…</div>

Relevant CSS: 

/* - All Entries Archive */
.entries #content div {
 display: inline-block;
 padding: 0.5em 0 0 0; /* 6px */
 min-width: 8em;
 max-width: 17em; /* 1024 = 4 columns; 1280 = 5 columns */
 overflow: hidden;
 vertical-align: top;
 border-top: 2px solid #336666;
}
.entries #content ol {
 padding: 0 0 0 2.5em;
}

Relevant VB6: 

'Wrap to a new row every 4 years:
If (Not yyyy) And (yyyy Mod 4 = 3) Then '2007, 2011
    sEntries.WriteLine DIV_CLEAR 'new row
Else
    sEntries.WriteLine DIV
End If

Previous float Technique

HTML, compacted and truncated as a summary: 

<div><h2>2003</h2>…</div>
<div><h2>2004</h2>…</div>
<div><h2>2005</h2>…</div>
<div><h2>2006</h2>…</div>
<div class="clear"><h2>2007</h2>…</div>
<div><h2>2008</h2>…</div>
<div><h2>2009</h2>…</div>
<div><h2>2010</h2>…</div>
<div class="clear"><h2>2011</h2>…</div>
<div><h2>2012</h2>…</div>

Relevant CSS: 

/* - All Entries Archive */
.entries #content div {
 float: left;
 width: 24.8%; /* IE6 & IE7 rounding */
 min-width: 8em;
 padding-right: 0;
 overflow: hidden;
}
.entries #content div.first {
 padding-left: 0;
}
.entries #content div.clear {
 clear: left; /* IE6 & IE7 forget this for subsequent columns */
}
.entries #content ol {
 padding: 0 0 0 2.5em;
}

Relevant VB6: 

sEntries.WriteLine DIV