I have been using a new CSS technique for creating fixed footers – that is, footers which pin themselves to the bottom of the browser window – without using JavaScript. Headscape designer Ed Merritt is the one who came up with the idea, and like most elegant solutions, this one is so simple that I wish I’d thought of it. It really works.
Assuming your basic HTML layout markup looks like below:
1
2
3
4
| <div id="container">
<div id="content"></div>
<div id="footer"></div>
</div> |
… you can use the following CSS example to pin your footer:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
| #container {
position:absolute;
min-height:100%;
}
#content {
margin-bottom:100px; /* same as footer height */
}
#footer {
position:absolute;
bottom:0;
height:100px; /* same as content margin-bottom */
} |
So, hack away. It’s not suitable for every design, of course, but it just might help you get rid of that annoying whitespace below your footer, for instance on a content-starved page which ends up far short of the window height.
Tags: css
One of my favorite web publications, A List Apart, has pushed an article about a new CSS layout technique that the author, Eric Sol, calls Faux Absolute Positioning. Up until now, I’d always relied primarily on floating divs. Other folks preferred using (real) absolute positioning, but that required the use of JavaScript to keep the footer from smooshing things.
For gridtastic designs, this new technique appears to be the best answer CSS has to offer yet. The benefits of absolute positioning, but using relative positioning + negative margins so as not to break the layout. I plan to try this out on future sites I work on, so I withhold final judgment, but as things look right now, Eric Sol will end up as my new CSS rockstar hero.
Tags: ala, css, Design
A List Apart, the famous online magazine “for people who make websites,” just published a pair of articles that help people who want to start out with Ruby on Rails: Getting Started with Ruby on Rails and Creating More Using Less Effort with Ruby on Rails.
No more than a day later, Digital Web responded with an Introduction to Django. I just find it interesting that we have all of this in the same week.
Ruby on Rails and Django are competing web application frameworks that follow the MVC pattern. Rails is built on the Ruby programming language, while Django uses Python. It’s friendly competition, of course… it all boils down to whether you’re a Pythonista or a Rubyist.
I am a huge fan of Rails, but I’d also like to learn more about Django… that is, if I can overcome my own Ruby vs. Python bias. One of my fondest memories of SXSW this year was hearing Michael Lopp ask from the stage, “What’s wrong with this Python code?” and someone in the audience called out, “It’s not Ruby!”
Oooh, snap!
Tags: python, ruby
The real reason designers don’t contribute to open source [via EncyteMedia].
ROTFL.
I do apologize to any designer on whom I’ve inflicted (or attempted to inflict) Subversion pain. While version control remains a necessary evil of software projects, svnX exists for those who are command-line shy…
So Brian let me know when you’re ready to check out the latest tree. User/pass: brian/w4?vteRsZvx3v#$U&TFCxsdfs^^^. Haha.
Everyone say hi to Mephisto, a way-cool Rails blogging engine. The two heavyweights behind it are none other than Rails Core developer Rick Olsen and DOM-scripting genius Justin Palmer.
Needless to say, I’ll be watching the project with much interest in the next few months, and I may seriously consider converting my blog over when trunk reaches 1.0. It’s at 0.5 now and there is already a really nice selection of refined features. The default template is the excellent Hemingway by Kyle Neath, and the template system uses Tobi Lütke’s Liquid engine. One thing I always look for is how a blog would handle potential comment spam; Mephisto currently uses Akismet, which requires an API key.
Ain’t open source software grand? I love it when a plan comes together.
