So having said all that, the way we’re handling CSS columns these days is actually pretty cool. Here’s some sample CSS, from a site in development with a 720px wide content area:
/* Column layouts */
.column { float:left; overflow:hidden;}
.columns { margin-bottom:20px; padding-top:10px; }
.three.columns .first { width:200px; padding-right:20px; }
.three.columns .second { width:200px; padding:0 20px; }
.three.columns .third { width:200px; padding-left:20px; }
.two.columns .first { width:300px; padding-right:20px; }
.two.columns .second { width:300px; padding-left:20px; }
This lets us code the XHTML like this:
<div class="three columns">
<div class="first column">
Column 1
</div>
<div class="second column">
Column 2
</div>
<div class="third column">
Column 3
</div>
<div style="clear:both;"></div>
</div>
… which is pretty nice semantically.
Tags: CSS, free stuff, tables, whitewhale
Comments: None »
Update: Quick Access continues to get a lot of traffic; thanks, everyone, for using our script! We’ve been excited to see some examples of how people are using it out there.
We’ve changed and tweaked the formula a bit since we posted this, and are thinking of releasing a 1.1. If there’s anything any of you would like to see QA do that it doesn’t already, please let us know in the comments!
Every higher ed website is going to have landing pages with a ton of links. Your various audiences each demand one-click access to what they need, but the resulting page is rarely very scannable and its hard to categorize these sundry links in ways that meet the expectations of all your visitors.
Enter Quick Access. Quick Access is a lightweight Javascript solution we first created for Haverford College to address this problem (we later ported this to jQuery for versions for Kenyon College and Southwestern University). It’s best summed up with: “Just start typing what you’re looking for.” Read more »
Tags: downloads, free stuff, javascript, jquery, quickaccess
Comments: 4 comments »