I am playing with a menu and CSS.

The question is IF the element has the same class assigned shouldn't it follow the styling?

In the attached picture, all the elements have class nav-link-1, the dropdowns have an additional class of dropdown-toggle but shouldn't they also follow the nav-link-1?

I thinkThose drop downs will have the sting applied to the additional class

Yeah, I suspected that, I removed the dropdown-toggle class and it still didn't follow the nav-link-1 class. That would also bring up another question of why assign additional classes if they aren't followed?

Keith, what I usually do in such cases:
If I give the elements class names myself, I give them one which is common for them all, like in your case 'nav-link-1'. Then I style them the way I want them. When that is done, I add the 2nd class names to those that need a 2nd one, and do the styling which is specific to them.

Or, if the class names alle all there already, I click in the middle of the 2nd class name to 'disable' it while I style everything pertaining to the first class name. Afterwards I click once more on the 'disabled' ones to make them come alive again, and continue styling the specific ones.

Thanks for the info, that's pretty much what I have been doing.

The menu is a component and it actually acts the same way, you have to style the dropdowns and the non-dropdown. In the grander scheme of things, it's not a big deal. Still, things like this just make CSS difficult to understand.

Thanks again.

If you tell us which component, and in which framework you are working, we might be able to help you better.

It is not clear what elements (<button>, <select> etc.) are being used in the example quoted, but it is, of course, not necessarily the case that an element with the same class follows the styling.

A. If one's CSS has the following, then a paragraph and an h1 element, each having class="bgc", would have a background of yellow -


B. If, on the other hand, one's CSS has the following, a paragraph with that class would have a yellow background, but an h1 element with that class would have a blue background -


SD4 sets classes for particular element tags as at B above, as can be seen from the CSS it generates. The answer to the question quoted above seems therefore to be 'No' if the elements don't have the same tag (e.g. <p>, <h1>).

Frank