Comments on: Reflections on max-width http://www.svendtofte.com/stylesheets/reflections-on-max-width/ rantings & scraps on code and web development Mon, 01 Dec 2008 20:04:12 +0000 http://wordpress.org/?v=2.6 By: HotPotatoe http://www.svendtofte.com/stylesheets/reflections-on-max-width/#comment-89 HotPotatoe Mon, 27 Oct 2008 15:57:44 +0000 http://www.svendtofte.com/?p=4#comment-89 Hi there, nice article and clear explanation. I have a question fron which I haven't seen any answer yet. I have a website done in flash 100%. I want this website to be inside a layer and I want this layer to grow free and expand to fill the user's browser till certain point, this is: A máximun width of 1600px and a máximun heigth of 1000px. (I can live without fixing the height if necessary) The flash movie inside the div has it's size set to 100% width and heigth. If you apply this hack, or the JELLO MOLD hack, or at least every hack I have found on the Web, the content of the layer (the swf movie) wont be displayed in IE!! It just dissappear!! It seems like because of it's relative width and height (100%) it doesn't have a solid presence to make it's container expand... Try it yourself, you will see what I mean. Can anybody bring me some help about this topic? Hi there, nice article and clear explanation.
I have a question fron which I haven’t seen any answer yet.
I have a website done in flash 100%.
I want this website to be inside a layer and I want this layer to grow free and expand to fill the user’s browser till certain point, this is: A máximun width of 1600px and a máximun heigth of 1000px. (I can live without fixing the height if necessary) The flash movie inside the div has it’s size set to 100% width and heigth. If you apply this hack, or the JELLO MOLD hack, or at least every hack I have found on the Web, the content of the layer (the swf movie) wont be displayed in IE!! It just dissappear!!
It seems like because of it’s relative width and height (100%) it doesn’t have a solid presence to make it’s container expand…
Try it yourself, you will see what I mean.
Can anybody bring me some help about this topic?

]]> By: Mauvis Ledford http://www.svendtofte.com/stylesheets/reflections-on-max-width/#comment-86 Mauvis Ledford Fri, 24 Oct 2008 18:03:49 +0000 http://www.svendtofte.com/?p=4#comment-86 @svend: I agree that the expression feature can be dangerous and in most cases the wrong tool to use, except in this exact circumstance and paired with an IE conditional statement. @Chad: I'd rather use conditional CSS for the one browser that needs it (IE6) than switch to tables unnecessarily. Additionally, the above approach can work with limiting the size of things like embeds and other content without having to wrap each element in a table. @svend: I agree that the expression feature can be dangerous and in most cases the wrong tool to use, except in this exact circumstance and paired with an IE conditional statement.

@Chad: I’d rather use conditional CSS for the one browser that needs it (IE6) than switch to tables unnecessarily. Additionally, the above approach can work with limiting the size of things like embeds and other content without having to wrap each element in a table.

]]> By: Chad Lester http://www.svendtofte.com/stylesheets/reflections-on-max-width/#comment-83 Chad Lester Wed, 22 Oct 2008 23:27:51 +0000 http://www.svendtofte.com/?p=4#comment-83 Frustratingly, all of my html was stripped out and I'm not sure how to post my example - I'll use square brackets instead. [table][tr][td style="width:40em;"][table][tr][td] Your content goes here [/td][/tr][/table][/td][/tr][/table] Hope that works. Frustratingly, all of my html was stripped out and I’m not sure how to post my example - I’ll use square brackets instead.

[table][tr][td style="width:40em;"][table][tr][td]

Your content goes here

[/td][/tr][/table][/td][/tr][/table]

Hope that works.

]]> By: Chad Lester http://www.svendtofte.com/stylesheets/reflections-on-max-width/#comment-82 Chad Lester Wed, 22 Oct 2008 23:25:40 +0000 http://www.svendtofte.com/?p=4#comment-82 Thanks for your post on this subject. However, it seems that there is a much simpler solution that works in every browser I tested: IE 6, IE 7, FireFox 3 (on Mac and PC) and Safari. With two nested tables: Your content goes here. What I have found is that "width" on a TD element is interpreted to mean: grow up to this width unless I'm constrained by my parent. The inner table is not really necessary unless your content might be smaller than the 40em and want a border or background color to shrink to the size of your content (in which case the style goes on the inner TD). It has no width assignment (width=auto), so it will grow to be just as big as is needed to hold the contents, but never bigger than the constraining parent. FYI, I was using: Granted, this is a lot of extra markup and hence, still sort of a hack. But it seems less hacky than using expression syntax to me. Am I missing something? Caveat - I have not read and understood the W3C table layout rules well enough to know if my solution is standards compliant. I only know that it works on the browsers I tested. The "expression" syntax is still worth knowing. Thanks, Chad Thanks for your post on this subject. However, it seems that there is a much simpler solution that works in every browser I tested: IE 6, IE 7, FireFox 3 (on Mac and PC) and Safari. With two nested tables:

Your content goes here.

What I have found is that “width” on a TD element is interpreted to mean: grow up to this width unless I’m constrained by my parent.

The inner table is not really necessary unless your content might be smaller than the 40em and want a border or background color to shrink to the size of your content (in which case the style goes on the inner TD). It has no width assignment (width=auto), so it will grow to be just as big as is needed to hold the contents, but never bigger than the constraining parent.

FYI, I was using:

Granted, this is a lot of extra markup and hence, still sort of a hack. But it seems less hacky than using expression syntax to me.

Am I missing something?

Caveat - I have not read and understood the W3C table layout rules well enough to know if my solution is standards compliant. I only know that it works on the browsers I tested.

The “expression” syntax is still worth knowing.
Thanks,
Chad

]]> By: flash tekkie http://www.svendtofte.com/stylesheets/reflections-on-max-width/#comment-77 flash tekkie Sat, 18 Oct 2008 10:23:47 +0000 http://www.svendtofte.com/?p=4#comment-77 Any script execution at the Style Sheet stack of the browser is a performance issue and more importantly a security threat so the use of IE expressions should not be encouraged. It's a non-standard approach that does not comply with W3C directives. Good news is <a href="http://tekkie.flashbit.net/browsers/internet-explorer-dumping-css-hacks-to-comply-with-standards" title="Internet Explorer dumping CSS hacks to comply with standards" rel="nofollow">Microsoft is ending expressions in Internet Explorer</a> as announced on Thursday earlier this week. Indeed a very nice move towards the standard-compliant browser. Any script execution at the Style Sheet stack of the browser is a performance issue and more importantly a security threat so the use of IE expressions should not be encouraged. It’s a non-standard approach that does not comply with W3C directives.

Good news is Microsoft is ending expressions in Internet Explorer as announced on Thursday earlier this week. Indeed a very nice move towards the standard-compliant browser.

]]> By: svendtofte http://www.svendtofte.com/stylesheets/reflections-on-max-width/#comment-68 svendtofte Thu, 04 Sep 2008 10:08:30 +0000 http://www.svendtofte.com/?p=4#comment-68 It's worth noting that CSS expressions will probably be disabled in IE8 as part of the effort to increase browser security. They will still work in "IE 7 mode", but this is still great motivation to <strong>not use these techniques unless you have substantial knowledge on these matters.</strong>. And while I don't get as much mail as I used to about this, the thing simply is that if you can't figure it out for yourself, you simply don't know enough about the subject matter to implement such a brittle and dangerous work-around. http://blogs.msdn.com/ie/archive/2008/09/02/ie8-security-part-vi-beta-2-update.aspx It’s worth noting that CSS expressions will probably be disabled in IE8 as part of the effort to increase browser security. They will still work in “IE 7 mode”, but this is still great motivation to not use these techniques unless you have substantial knowledge on these matters.. And while I don’t get as much mail as I used to about this, the thing simply is that if you can’t figure it out for yourself, you simply don’t know enough about the subject matter to implement such a brittle and dangerous work-around.

http://blogs.msdn.com/ie/archive/2008/09/02/ie8-security-part-vi-beta-2-update.aspx

]]> By: Nataliya http://www.svendtofte.com/stylesheets/reflections-on-max-width/#comment-35 Nataliya Wed, 30 Jul 2008 01:20:47 +0000 http://www.svendtofte.com/?p=4#comment-35 I found your blog searching for "min/max width in css/html". This is so cool what you wrote! Thank you for that. I found your blog searching for “min/max width in css/html”. This is so cool what you wrote! Thank you for that.

]]> By: Timothy http://www.svendtofte.com/stylesheets/reflections-on-max-width/#comment-6 Timothy Thu, 10 Jul 2008 19:09:13 +0000 http://www.svendtofte.com/?p=4#comment-6 I want to thank you for this. I was racking my brain trying to figure out why IE wouldn't render properly even though I was working with the standard. I will be visiting often from now on. Keep up the good work. I want to thank you for this. I was racking my brain trying to figure out why IE wouldn’t render properly even though I was working with the standard. I will be visiting often from now on.

Keep up the good work.

]]>