CSS

[manofprogram]

In CSS, if a div in html were to have multiple CSS properties (be it the color red, animated, change color) why do I need to specify in a CSS file multiple CSS selectors to do so? Why can't I combine all those CSS properties into one selector?

[JorgeM]

Yes you can combine all of those properties using one selector. Is there a reason why you believe that you couldn't. Do you have an example?

[manofprogram]

For example, with a horzontal drop down menu. This CSS is used:

ul#navmenu .sub1 a {
    margin-top: 5px;
    }

ul#navmenu .sub2 a {
    margin-left: 3px;
    }

ul#navmenu li:hover > a {
    background-color: #CFC;
    }

ul#navmenu li:hover a:hover {
    background-color: #FF0;
    }

Look at ul#navmenu li:hover. The html div element is told twice (ul#navmenu li:hover > a AND ul#navmenu li:hover a:hover) about background color. I have tried to combined both properties in one CSS selector. It does not work. Why?

[Nathanaelneal]

I have a website but that site 2 links ins't working and showing this dialogue.
This webpage has a redirect loop.
Anyone suggest me for the issue
website is e commerce category.

[JorgeM]

ul#navmenu li:hover > a {
    background-color: #CFC;
    }

ul#navmenu li:hover a:hover {
    background-color: #FF0;
    }

Both of these selectors are basically targetting the same element. They are actually both applying but since there is more than of the same background-color property applied, one has to take precedence over the other. In this case, the yellow background takes priority.

How would you want to combine these two into one? If you did that, you still would only have one background color applied.

[tdrosiadis]

For what I can see in the snippet in question the 1st selector selects the 1st <a> child of the list's <li> element while in HOVER state. The 2nd selector selects (and sets the bacjground color) of the previous one BUT in its HOVER state.
So, I think that both are needed because they select defferent states of the - much the same - same element (not completelly same because of the 1st <a> child selector).