Archive for February, 2007

Matching Columns Script – Update.

Saturday, February 17th, 2007

Hi,

I decided to create another blog post to make it easier to find the updated version of the important matching columns script – it was buried in the originals article’s comments.

Notes:

Updated script by: Jonathan del Mar

I have modified the script to work with multiple class groups also with elements with multiple class names

/*
Derived from a script by Alejandro Gervasio.
Modified to work in FireFox by Stefan Mischook for Killersites.com

Modified to work with multiple class groups also with elements with multiple class names
by Jonathan del Mar (dec-14-2006)

How it works: just apply the CSS class of ‘column’ to your pages’ main columns.

to work with different classes
add

var columns = new Array(’class_name1′, ‘class_name1′…);

by Jonathan del Mar

by default the script will call
matchColumns();
and the default class_name is ‘column’
(see the bottom of this script)
by Jonathan del Mar

*/
matchColumns=function(my_class){

var divs,contDivs,maxHeight,divHeight,d;

// get all elements in the document

divs=document.getElementsByTagName(’div’);

contDivs=[];

// initialize maximum height value
maxHeight=0;
if (!my_class) {
my_class = ‘column’;
}

my_regex = new RegExp(’(.* |^)’ + my_class + ‘( .*|$)’);

// iterate over all elements in the document

for(var i=0;i elements with class attribute ‘container’

//if(/\bcolumn\b/.test(divs[i].className)){
// modified by Jonathan del Mar to match ‘column’ in multiple classes

if(my_regex.test(divs[i].className)){
d=divs[i];

contDivs[contDivs.length]=d;

// determine height for element

if(d.offsetHeight){

divHeight=d.offsetHeight;

}

else if(d.style.pixelHeight){

divHeight=d.style.pixelHeight;

}

// calculate maximum height

maxHeight=Math.max(maxHeight,divHeight);

}

}

// assign maximum height value to all of container elements

for(var i=0;i
var columns = new Array(’class_name1′, ‘class_name2′, …);

to your html header.

Eric Meyer Interview

Monday, February 12th, 2007

My friends at Lunarpages recently interviewed the well known tech/nerd author Eric Meyer.

Meyer is well known for his CSS books (I’ve read a few) and the books are pretty good overall. Especially the O’reilly titles.

My beef is that CSS hacks are just a bad idea, and Meyer uses his hacks all over his books …

That said, Amy (from Lunarpages) asked me if I had any questions for Eric; being a trouble maker that I am, I asked this question:

Do you regret promoting the use of CSS hacks given the recent issues with IE7 – i.e. that it broke certain commonly used hacks?

Eric: No. I always did my best to be clear that hacks were, by their nature, fragile beasts, and could be broken by a future revision. At the same time, what else could we do? It was either hack around browser bugs, or abandon CSS as a layout tool. Neither was palatable, but the former was less unpalatable than the latter. What I regret is that the hacks were necessary at all.

I find the answer interesting, but I don’t think it reflects the reality of the situation:

There was and is another option: IE conditional comments.

I won’t go in details about IE conditional comments here (just watch the video,) but I have to wonder why Eric and the other web standards proponents did not talk about this solution that easily and effectively solves one of CSS’ biggest failings (in the real world)?

Regardless of that point, it is an interesting interview with someone who has had some impact on web design today.

CIAO,

Stefan Mischook

Created By Stefan Mischook  |  Site Map  |  Top of page  go to top of page