Grow your CSS skills. Land your dream job.

Possible with multiple class-conditions?

  • # September 27, 2009 at 4:32 pm

    Hello everyone!

    I have a case where I think it would be great if you could assign a rule to objects that meet multiple conditions, like is having both of these classes.

    So if something like this would work.

    Code:
    .background {
    background:top left;
    }
    .blue&&.background {
    background-image:url(“bluebg.png”);
    }
    .red&&.background {
    background-image:url(“redbg.png”);
    }

    Off course, in this case it would be quite useless (just add an extra class .blueBackground), but say it shall depend on an ancestor, like:

    Code:
    .background {
    background:top left;
    }
    #wrapper>.blue && .background {
    background-image:url(“bluebg.png”);
    }

    then, you could use it for making elements with the background-class have different backgrounds, depending on the surrounding element, without having to use an extra class.

    I hope you understand my thoughts, otherwise just tell me and I’ll try to explain in another way.

    So, does it exist a solution for this?

    Edit:
    Or is it perhaps so that you can use hover on an element, that shall change another element that isn’t a child to the hovered element, like this:

    Code:
    div A—– div aa
    —– div ab < --- a hover here makes...
    ----- span ac
    div B----- span ba
    -----div bb <---- ...this change properties.

    Div A and B are siblings, and div ab and div bb are cousins.

    Thanks in advance!

Viewing 1 post (of 1 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".