Targeting only one class with CSS

kia4567

My website here I'm creating for a friend is giving me issues with the input[type="button"]. I only a specific style to be applied to the button in the sidebar ONLY. However no matter what I do it effects all buttons.

#sidebar.widget-wrap input[type="button"], input[type="submit"] {
    clear: both;
    display: block;
    margin-top: 2em;
    width: 100%;
}

How do I make it only effect the go button in the sidebar?

kapa

You must duplicate #sidebar.widget-wrap:

#sidebar.widget-wrap input[type="button"], 
#sidebar.widget-wrap input[type="submit"] {
}

Otherwise your selector would result in every input[type="button"] that is inside #sidebar.widget-wrap and every input[type="submit"].

The comma has no special meaning, it only combines two (or more) selectors. The result will always be the same if you use two separate selectors instead of the combined one:

div a, div span { color: yellow }
/* is the same as */
div a { color: yellow }
div span { color: yellow }

Collected from the Internet

Please contact [email protected] to delete if infringement.

edited at
0

Comments

0 comments
Login to comment

Related