Nested CSS with pseudo class

Lately I had a bit of an design issue with a web front end based on classical php/html/css. I wanted to display images in different sizes on different pages. But I wasn´t able to touch the php / html source so my only chance was to work on the css. But – I also wasn´t able to touch the css (pseudo) classes or introduce new ones.

After quite some time of research I discovered, that CSS offers a great way to nest statements so here is what I´ve done.

The original CSS class looked like this:

.td_value_details {
vertical-align: top;
}

And here is how I nested my image size statement in it:

.td_value_details img {max-width: 600px; height: 350px;} {
vertical-align: top;
}

I really didn´t know that this was possible and I´m pretty sure it´s not best practice, but it really does the job.

 

Leave a Reply

Your email address will not be published. Required fields are marked *