With CSS3 both :not() selector as well as attribute contains selector are available, but while mixing the both there comes the problem, it is not working.
HTML:
<input type='text'/>
<input type='text' id="dasd_Date_asd"/>
CSS:
input[type='text']:not(input[id*='Date']) {
display:none;
}
Can anyone tell what is going on wrong here?
Note: There is no privilege given to us for changing the markup.
You can't use two selectors in not:
input[type='text']:not([id*='Date']) {
display: none;
}<input type='text' />
<input type='text' id="dasd_Date_asd" />Selectors level 3 does not allow anything more than a single simple selector within a :not() pseudo-class.
You should first select input type and then cutt off the input with type id that has value "Date". your were again providing input as a selector in :not()
try this.
input[type='text']:not([id*=Date]) {
display:none;
}<input type='text'/>
<input type='text' id="dasd_Date_asd"/>As of 2021 your code actually works and you can use complex selectors in :not() statements. It works for all major browsers (https://caniuse.com/css-not-sel-list)
