Summarize CSS selectors

Question

Is there any possibility to summarize CSS Selectors? This is my stylesheet:

form.image_form > div > label > img
{
    display: block;
    margin-left: auto;
    margin-right: auto;
}

form.image_form > div
{
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    width: 100%;
    height: 156px;
    display: table-cell;
    vertical-align: middle;
}

form.image_form > div:hover
{
    background: green;
}

form.image_form > input[type="radio"]
{
    display: none;
}

form.image_form > input[type="radio"]:checked + div
{
    background: red;
}

and something like this is what I'd like to archieve:

form.image-form
{
    > div
    {
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        border-radius: 5px;
        width: 100%;
        height: 156px;
        display: table-cell;
        vertical-align: middle;

        > label > img
        {
            display: block;
            margin-left: auto;
            margin-right: auto;
        }

        :hover
        {
            background: green;
        }
    }

    > input[type="radio"]
    {
        display: none;

        :checked + div
        {
            background: red;
        }
    }
}

So is there any possibility to combine/summarize/interlace this code? (I apologize if it looks like I did no research, I indeed did but couldn't fine anything in w3c documentation. Maybe I didn't use the right search terms.)

Answer 1

With "pure" CSS this isn't possible. But there are little helpers like LESS or SASS which will help you achieving this.