Menu
I see websites like Amazon and Google when you shrink the width of the web browser the elements only squish to a certain point and then it stops squishing even if you shrink the width even more.
What kind of techniques would allow this? Is there a specific CSS attribute that can enable this?
902
To prevent a text field from being resized, you can use the CSS resize property with its "none" value. After it you can use the height and width properties to define a fixed height and width for your <textarea> element.
You should set body and html to position:fixed; , and then set right: , left: , top: , and bottom: to 0; . That way, even if content overflows it will not extend past the limits of the viewport. Caveat: Using this method, if the user makes their window smaller, content will be cut off.
You can use the CSS zoom property to scale any HTML element. Note that it does not work in Firefox, you could use -moz-transform: scale(NUMBER); instead (and if you go that route, you can use transform: scale(NUMBER); on all browsers, too).
You're probably seeing the min-width and min-height styles in action.
eg:
.myclass {
width: 50%;
min-width:100px;
}
...will take up 50% of the container object, so can be resized, but will never get smaller than 100px wide.
min-height works in much the same way.
Note that if you need to support IE6, this browser doesn't support min-height or min-width. (there are work-arounds for this, but the best solution is not to support IE6)
74
The CSS min_width property.
21
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
