Tumblr (3.0; @jameseilers)http://jameseilers.com/<img src="http://30.media.tumblr.com/tumblr_lysxa5ORte1qb4ngmo1_500.jpg"/><br/><br/>http://jameseilers.com/post/16962892514http://jameseilers.com/post/16962892514Fri, 03 Feb 2012 00:15:40 -0500<img src="http://30.media.tumblr.com/tumblr_lys41sJt7o1qb4ngmo1_r1_500.jpg"/><br/><br/><p>The Roosevelt Lake Dam.</p>http://jameseilers.com/post/16928401689http://jameseilers.com/post/16928401689Thu, 02 Feb 2012 13:44:00 -0500<img src="http://27.media.tumblr.com/tumblr_lys40qGWC51qb4ngmo1_500.jpg"/><br/><br/><p>View along the Apache Trail outside of Phoenix, AZ.</p>http://jameseilers.com/post/16928377862http://jameseilers.com/post/16928377862Thu, 02 Feb 2012 13:43:37 -0500arizonacanyons<img src="http://25.media.tumblr.com/tumblr_lys1a2QyXz1qb4ngmo1_500.jpg"/><br/><br/><p>My GORUCK GR1 out with me on the dunes at White Sands National Monument.</p>http://jameseilers.com/post/16926153006http://jameseilers.com/post/16926153006Thu, 02 Feb 2012 12:44:25 -0500GORUCKgr1white sandsnew mexico<img src="http://24.media.tumblr.com/tumblr_lyqiaj28t81qb4ngmo1_500.jpg"/><br/><br/>http://jameseilers.com/post/16881782283http://jameseilers.com/post/16881782283Wed, 01 Feb 2012 16:56:41 -0500<img src="http://29.media.tumblr.com/tumblr_lyp0f9UR9E1qb4ngmo1_500.jpg"/><br/><br/>http://jameseilers.com/post/16850521906http://jameseilers.com/post/16850521906Tue, 31 Jan 2012 21:33:06 -0500<img src="http://25.media.tumblr.com/tumblr_lyonw4iyT31qb4ngmo1_500.jpg"/><br/><br/>http://jameseilers.com/post/16836697038http://jameseilers.com/post/16836697038Tue, 31 Jan 2012 17:02:27 -0500<img src="http://27.media.tumblr.com/tumblr_lyomdwmVWi1qb4ngmo1_500.jpg"/><br/><br/>http://jameseilers.com/post/16834793158http://jameseilers.com/post/16834793158Tue, 31 Jan 2012 16:29:55 -0500<img src="http://24.media.tumblr.com/tumblr_lyo5z6ceQl1qb4ngmo1_500.jpg"/><br/><br/>http://jameseilers.com/post/16820331778http://jameseilers.com/post/16820331778Tue, 31 Jan 2012 10:35:26 -0500<img src="http://24.media.tumblr.com/tumblr_lyn9rzrPsE1qb4ngmo1_500.jpg"/><br/><br/>http://jameseilers.com/post/16802509854http://jameseilers.com/post/16802509854Mon, 30 Jan 2012 22:59:56 -0500<img src="http://28.media.tumblr.com/tumblr_lyl1l8ul8n1qb4ngmo1_500.jpg"/><br/><br/>http://jameseilers.com/post/16724348430http://jameseilers.com/post/16724348430Sun, 29 Jan 2012 18:07:55 -0500<img src="http://29.media.tumblr.com/tumblr_lyc1v3IcaG1qb4ngmo1_500.jpg"/><br/><br/><p>Planning out next week’s road trip.</p>http://jameseilers.com/post/16443031596http://jameseilers.com/post/16443031596Tue, 24 Jan 2012 21:35:27 -0500<p>I’ve just finished updating the design of my site. Most of it consisted of refining the existing theme. The biggest change is in the overall layout of the posts.<!-- more --></p> <p>Many blogs (previously this one too) are very narrow. It is more natural to read a narrower column of text rather than an article spread across a 27” monitor. With many of today’s devices featuring wide screens, a lot of real estate is lost when your browsing a website that is 700px wide and you have 2560px of room across your screen. To take advantage of more screen real-estate and get more content above the fold I decided to come up with a fluid multi-column layout. I wanted my site to have one to three columns based on how wide the browser window was. I knew how to take care of the fluid layout, but getting the vertical columns to work so that that posts floated correctly was more challenging. Most sites I came across that used a two or three column layout in this manner used the Masonary JQuery javascript to mimic a vertical float. After a bit of searching I came across to do this <a href="http://sickdesigner.com/index.php/2011/html-css/masonry-css-getting-awesome-with-css3/" title="Masonary CSS">with only CSS</a>—CSS3 columns. One interesting thing I found when setting up the the fluid column layout was that Firefox had problems transitioning from two columns to down to zero—it would make sense that in this case 0=1 since they appear the same. Changing the zero to one for the mozilla browser extensions worked. Webkit had no issues. I made columns 400px wide so that I could get three columns on most desktops and laptops, but permalink pages render the post at 500px wide so that things are a little bigger when one post is the only focus. </p> <p>I decided to to go with an image free design to keep things very light and simple. Another reason I avoided images was because of resolution issues on different devices (retina displays). There are CSS solutions to deal with higher resolution displays but I would rather find a more efficient solution. SVG graphics will be my next project. </p> <p>Lastly, I haven’t check but I’m pretty sure this site looks awful in IE… and I couldn’t care less. I do provide a public service announcement for anyone that does browse my website in IE, “Every time you open Internet Explorer, a small kitten dies. Please browse responsibly. Download Google Chrome or Safari.”</p> <p>Time to discover bugs.</p>http://jameseilers.com/post/16391878106http://jameseilers.com/post/16391878106Mon, 23 Jan 2012 23:11:17 -0500web designdesigndevelopmenthtmlcss<img src="http://29.media.tumblr.com/tumblr_ly8c24nkNe1qb4ngmo1_500.jpg"/><br/><br/>http://jameseilers.com/post/16329578905http://jameseilers.com/post/16329578905Sun, 22 Jan 2012 21:25:15 -0500<a href="http://sickdesigner.com/index.php/2011/html-css/masonry-css-getting-awesome-with-css3/">Masonry CSS</a>: <p>A CSS replacement for Masonry JQuery!</p>http://jameseilers.com/post/15603255772http://jameseilers.com/post/15603255772Mon, 09 Jan 2012 22:46:00 -0500css<iframe width="400" height="300" src="http://www.youtube.com/embed/yKgTHc1szi4?wmode=transparent&autohide=1&egm=0&hd=1&iv_load_policy=3&modestbranding=1&rel=0&showinfo=0&showsearch=0" frameborder="0" allowfullscreen></iframe><br/><br/><p>See my family’s Christmas Day!</p>http://jameseilers.com/post/14960016327http://jameseilers.com/post/14960016327Thu, 29 Dec 2011 00:34:11 -0500time-lapsechristmas<span id="video_player_14922154263">[<a href="http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash" target="_blank">Flash 10</a> is required to watch video.]</span><script type="text/javascript">renderVideo("video_player_14922154263",'http://jameseilers.com/video_file/14922154263/tumblr_lwxalaVUtk1qb4ngm',400,533,'poster=http%3A%2F%2Fmedia.tumblr.com%2Ftumblr_lwxalaVUtk1qb4ngm_r1_frame1.jpg,http%3A%2F%2Fmedia.tumblr.com%2Ftumblr_lwxalaVUtk1qb4ngm_r1_frame2.jpg,http%3A%2F%2Fmedia.tumblr.com%2Ftumblr_lwxalaVUtk1qb4ngm_r1_frame3.jpg,http%3A%2F%2Fmedia.tumblr.com%2Ftumblr_lwxalaVUtk1qb4ngm_r1_frame4.jpg,http%3A%2F%2Fmedia.tumblr.com%2Ftumblr_lwxalaVUtk1qb4ngm_r1_frame5.jpg')</script><br/><br/><p>Sweet Christmas card.</p>http://jameseilers.com/post/14922154263http://jameseilers.com/post/14922154263Wed, 28 Dec 2011 11:46:00 -0500<img src="http://27.media.tumblr.com/tumblr_lwkxahDdRB1qb4ngmo1_500.jpg"/><br/><br/>http://jameseilers.com/post/14588951628http://jameseilers.com/post/14588951628Wed, 21 Dec 2011 19:27:51 -0500<img src="http://30.media.tumblr.com/tumblr_lwidvu0W3D1qb4ngmo1_500.jpg"/><br/><br/><p>My GORUCK GR1 just arrived!</p>http://jameseilers.com/post/14511630757http://jameseilers.com/post/14511630757Tue, 20 Dec 2011 10:33:00 -0500goruckpackgearbackpack<img src="http://30.media.tumblr.com/tumblr_lwdbvx2F2q1qb4ngmo1_500.jpg"/><br/><br/>http://jameseilers.com/post/14371870816http://jameseilers.com/post/14371870816Sat, 17 Dec 2011 17:02:19 -0500