<?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>onDeveloping &#187; css</title>
	<atom:link href="http://zbrustudios.com/onDeveloping/tag/css/feed/" rel="self" type="application/rss+xml" />
	<link>http://zbrustudios.com/onDeveloping</link>
	<description>thoughts on developing from zach mccorkhill @ z.bru studios</description>
	<lastBuildDate>Thu, 18 Nov 2010 22:02:17 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.2.1</generator>
		<item>
		<title>on Footers Attached to Bottoms</title>
		<link>http://zbrustudios.com/onDeveloping/2009/01/on-footers-attached-to-bottoms/</link>
		<comments>http://zbrustudios.com/onDeveloping/2009/01/on-footers-attached-to-bottoms/#comments</comments>
		<pubDate>Sun, 01 Feb 2009 00:33:47 +0000</pubDate>
		<dc:creator>zach</dc:creator>
				<category><![CDATA[css]]></category>
		<category><![CDATA[thoughts]]></category>
		<category><![CDATA[html]]></category>

		<guid isPermaLink="false">http://zbrustudios.com/onDeveloping/?p=57</guid>
		<description><![CDATA[so it&#8217;s been a little while since i posted last, mostly because i&#8217;ve been busy transferring things over to my new 3.06 GHz, 24&#8243; screen iMac (can you hear my revelry?) &#8211; a task both easy and harder than i thought. it comes with a lot of decisions for me: do i transfer everything over, [...]]]></description>
			<content:encoded><![CDATA[<p>so it&#8217;s been a little while since i posted last, mostly because i&#8217;ve been busy transferring things over to my new 3.06 GHz, 24&#8243; screen iMac (can you hear my revelry?) &#8211; a task both easy and harder than i thought. it comes with a lot of decisions for me: do i transfer everything over, or just my design tools and materials (this is a &#8220;work&#8221; purchase, after all)? do i continue using some of the hot copies of old software i have or bite the bullet and purchase latest versions? do i look for new stuff that i previously couldn&#8217;t run (i swear, i couldn&#8217;t even use dashboard on my old iBook anymore)?</p>
<p>previously, i was using <a href="http://www.marinersoftware.com/sitepage.php?page=85" target="_blank">MacJournal</a> for updating this blog, and i really enjoyed using it. it&#8217;s really easy to use, i can keep all sort of notes in it and organize them well, and it&#8217;s so easy to publish to WordPress sites. but it&#8217;s not entirely necessary. and i did just drop a bunch of money.</p>
<p>i also had a bunch of fun software (like <a href="http://boinx.com/istopmotion/overview/" target="_blank">iStopMotion</a> &#8211; a great program for doing just what the title says), but i&#8217;m hesitant to clog up my new machine. on the other hand, it&#8217;s got way more space and processing power, so maybe it&#8217;s no big deal.</p>
<p>anyway, i feel like i&#8217;m rambling. here&#8217;s something of more substance:</p>
<p>having just started working on such a huge screen, i was reminded this week of the importance of checking work on different browsers and screens. i just started work with another client where i was handed a site that was mostly completed, but in pieces. i went through and put it together and tweaked the css so that it actually worked &#8211; or so i thought.</p>
<p>i was using a standard centered container, with a footer attached to the bottom. i do this with the following css:</p>
<pre class="brush: css;">
html, body{
height:100%;
}

* html #container {    /* for browsers that don't recognize min-height */
height:100%;
}

#container{
min-height:100%;
margin: 0 auto;
width:980px;
position:relative;
}

#footer{
height:30px;
width:980px;
position:absolute;
bottom:0px;
}
</pre>
<p>this normally does the trick just fine with html laid out like this:</p>
<pre class="brush: xml;">
&lt;div id=&quot;container&quot;&gt;
&lt;div id=&quot;footer&quot;&gt;&lt;/div&gt;
&lt;/div&gt;
</pre>
<p>and indeed, once i had it laid out that way, it looked great: centered content, footer attached to the bottom when the content didn&#8217;t fill the container&#8230; at least on my new large screen.</p>
<p>i should mention the first time i realized i had to do something to attach the footer to the bottom of my screen was when i looked at a project on a larger monitor and realized it wasn&#8217;t: on my smaller screen, it wasn&#8217;t very often that the content didn&#8217;t stretch to the bottom of the browser, so i normally didn&#8217;t notice.</p>
<p>turns out this goes both ways. when i emailed the site to the client, i was told that there was a problem with the content disappearing behind the footer. and it was. when i decreased the size of my browser window, everything inside the content section slid behind the footer. the problem was that the previous designer had needlessly put &#8220;float:left&#8221; on everything inside the container (except the footer), so it was floating behind the footer. but that&#8217;s not really the point.</p>
<p>the point is, having only viewed it on a large screen, i hadn&#8217;t even noticed something that would have been glaringly obvious on a smaller screen. so it goes both ways, and it&#8217;s still very important for me to check my work on multiple screens.</p>
]]></content:encoded>
			<wfw:commentRss>http://zbrustudios.com/onDeveloping/2009/01/on-footers-attached-to-bottoms/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>

