Max-width in Internet Explorer 6 #IE6

It’s still a problem, hopefully not much longer, but how do you specify a max-width in IE6?

It’s remarkably simple thanks to a proprietary Internet Explorer CSS expression!


#element {
width: expression(document.body.clientWidth > 500? "500px" : "auto");
}

Just watch out for two things; firstly you have to make sure the greater than expression will not trigger a loop (do not use >=) and, sadly, this does not work on the body tag. To complete the latter you will have to use a wrapping div

Min-width in Internet Explorer 6 #IE6

As you probably already know, IE6 does not support the CSS2 property min-width. Thankfully it’s not as widely used as min-height but every so often we are asked to code it.

There are other solutions which use additional mark-up to create a min-width effect but in my opinion the best solution is CSS expressions.

I know, they suck right. Well apart from the performance hit they actually work. Combine them with a IE6 onlyselector or a conditional comment and you have your solution!

* html #selector{min-width:960px; *width:expression(document.body.clientWidth < 960? "960px": "auto" );}

and if you are wondering… I don’t like to use extra mark-up for fixing bugs as I much prefer CSS. Why make everyone suffer for the sake of the minority!

Force the facebook ‘like’ button language

Facebook automatically changes the language of the ‘like’ button to the language of the user who’s session is logged in. Although this is a cool feature sometimes you might want to override it.

Thankfully it’s surprisingly easy… all you have to do is add an URL parameter which specifies the country code! So for spanish you insert “&locale=es_ES“, making sure to honour the capitalisation.

English Facebook like button

//standard iframe code
<iframe src="//www.facebook.com/plugins/like.php?href=http%3A%2F%2Fdeveloper.simondonaldson.com%2F&amp;send=false&amp;layout=standard&amp;width=450&amp;show_faces=true&amp;action=like&amp;colorscheme=light&amp;font&amp;height=80" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:450px; height:80px;" allowTransparency="true"></iframe>

Spanish Facebook like button

//now spanish
<iframe src="//www.facebook.com/plugins/like.php?href=http%3A%2F%2Fdeveloper.simondonaldson.com%2F&amp;send=false&amp;layout=standard&amp;width=450&amp;show_faces=true&amp;action=like&amp;colorscheme=light&amp;font&amp;height=80&amp;locale=es_ES" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:450px; height:80px;" allowTransparency="true">