Recently I had a design provided that required a scalable image either side of the content area when the screen was wider then a specif point.
Since it has been a long time since my last blog post, I thought I would share my solution.
The image needed to scale so that width wise it fitted on screen and scaled up to a maximum size.
Afetr that maximum size the image no longer scales and just sits either side of the content.
I imagine most of the web dev world hadn't realized that the display module of CSS3 was only in working draft status. There are some serious improvements and equally serious issues involved with this seemingly innocuous property.
I've taken the liberty of copying a letter to the whatwg and html5wg from the css3 wg. This is informative reading and well worth your time. Don't tl;dr the message.
Sep 27 (1 day ago)
to www-style, Boris, public-cssacc, whatwg, public-html, List, Daniel
We have reached 10 years old, a fair age for any website. Actually the domain was registered in October 2002, the site started with the CSS Generator and I added the forum in March 2003. So we are actually closer to 10.5 years old. I would like to thank all the people who have been involved, specially the moderators who keep this place running when I leave it in auto pilot mode.
Before you post please consider something. We, that is the people that make tech forums like this one viable and useful for the community, keep them alive and provide a little of our experience, and time for free, really do not appreciate people taking advantage of them for what they think is possibly useful SEO gaming, we have to deal with the threads created, wasting our time and more importantly taking the time we may spend helping someone with a genuine need and chucking it away dealing with the utter drivel you post.
Text-overflow effects inline content when it overflows it's block container. Overflow can only occur if the block container has an overflow value of something other then visible and when white-space is set to no-wrap.
ellipsis: Renders an ellipsis character (U+2026) or three dots "..." to represent clipped inline content.
clip: Clips inline content that overflows, any extra characters will not be visible. Characters may be only partially rendered.