...

View Full Version : attempting a min-width alternative



Excavator
12-30-2006, 10:59 PM
Why can't I get an image to stop a wrapper from shrinking?

Look at my test page (http://www.nopeople.com/CSS/min-width-test/) to see what I've tried so far...
I'm not having much luck.

-Just trying for an IE6 alternative. I know if I set a min-width that IE7 and FF will do it.
-border around .gif is just temporary, so you can see it.

1212jtraceur
12-31-2006, 04:22 AM
I'm not very sure about the behavior when an element is sized smaller than a contained image, but I think it should act just as it does in your example...

Excavator
12-31-2006, 04:35 AM
but I think it should act just as it does in your example...

haha, that's the problem, huh? It's behaving just like it's supposed to.
I have tried everything I can think of today...
Maybe tomorrow I'll be smarter.

_Aerospace_Eng_
12-31-2006, 04:41 AM
The image shouldn't stop the wrapper from shrinking. It doesn't fit so it has no place to go. Only way to stop the wrapper from shrinking is to use min-width. Normally I use IE CSS expressions to fake min-width. The way I see it is if the user is using IE then its likely they don't even know how to turn off javascript because if they did then they probably be using a different browser like Firefox. I understand some people are forced to use IE because of their job but then again if they are at their job what are they doing browsing the internet.

felgall
12-31-2006, 07:09 AM
You don't need to use an image to set a minimum width - you can set the minimum width using stylesheet commands. For example if you want all elements with a class of [b]small[/] to be at least 50 pixels wide you can specify:


.small {min-width:50px;}
* html .small {width: document.body.clientWidth < 51 ? "50px" : "auto";}

Firefox, Opera, Safari and IE7 will read the first line and ignore the second while IE6 will ignore the first and process the second to give the same result.

Arbitrator
12-31-2006, 10:03 AM
* html .small {width: document.body.clientWidth < 51 ? "50px" : "auto";}I think you need to mark that as an expression or something, like this:


* html .small { width: expression(document.body.clientWidth < 51 ? "50px" : "auto"); }

Internet Explorer 6 functionally treats width the same as min-width though, so you may as well use the shorter * html .small { width: 50px; }.

_Aerospace_Eng_
12-31-2006, 10:34 AM
I think you need to mark that as an expression or something, like this:


* html .small { width: expression(document.body.clientWidth < 51 ? "50px" : "auto"); }

Internet Explorer 6 functionally treats width the same as min-width though, so you may as well use the shorter * html .small { width: 50px; }.
But what if mostly text is to be within the element? The 50px will cause the text to wrap. Using a min-width hack will allow the text to fill up more of the screen so I don't think just setting the width here will help.

Arbitrator
12-31-2006, 10:45 AM
But what if mostly text is to be within the element? The 50px will cause the text to wrap. Using a min-width hack will allow the text to fill up more of the screen so I don't think just setting the width here will help.HmmÖ Youíre right. Iím thinking over‐sized content along the lines of the expanding box bug (http://www.positioniseverything.net/explorer/expandingboxbug.html).

Excavator
12-31-2006, 06:18 PM
That's pretty cool felgall, I'd never seen that before.
I googled "document.body.clientWidth " and ended up with what's on that test page I linked to.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum