Wednesday, March 21, 2007

Emulating max-width in IE

Great little article concerning how to constrain the maximum width of text columns in IE to a specified pixel width, while still offering users the ability to scale the page more narrowly if necessary. Many versions of IE do not properly implement max-width and so modern CSS2- based solutions are out. On to the hackery:

http://www.svendtofte.com/code/max_width_in_ie/ (the great little article)
http://msdn.microsoft.com/library/default.asp?url=/workshop/author/dhtml/overview/recalc.asp (MSFT page on dynamic properties)


The meat for my purposes (read the original article; it has many implementations that may serve you better):

<html>
<style>
body {
width:100%;
margin:0;
padding:0;}

p {
border:1px solid red;
max-width:800px;
width:expression(document.body.clientWidth > 800? "800px": "auto" );
}
</style>

Somewhat predictably, these hacks don't work at all in HTML mail, which is unfortunate given that's where I wanted to implement it. However, they don't break things either, which is nice for the purposes of webpages that live dual lives as standalone pages and components of multipart mails. My understanding is that max-width is implemented in Outlook 2007 along with a bunch of other CSS properties. By 2019 or so I imagine be able to confidently implement this when we aren't being deservedly chased around by unhappy  Replicants.


Technorati tags: , , , ,

0 Comments:

Post a Comment

Subscribe to Post Comments [Atom]

<< Home