Is it possible to prepare different styles that change page layout depending on the information if the content of a page is “long”. I want to enable CSS3 columns when content is long and disable them when content is short.
How do you define “long”? It’s open – it can be a certain amount of paragraphs, a number of pixels etc.
A similar media query that can change styles depending on the browser window width:
@media only screen and (min-width: 1278px) {
/* code for wide-screen window */
}
I want to use pure CSS and no JavaScript if possible (with JavaScript it’s simple – I’d just add a class after measuring page offsets).
As far as I know there is no way with a media query
The w3 specification for the height attribute specifies that is is not for actual content-height but rather than browser height, similar to the width attribute.
I would go with a quick JS solution exactly as you described.