Как перенести кавычки с scss в css?

Question

[pashjka]

использую vscode
плагин live sass compiler
при компиляции из scss в css теряются кавычки

есть запись в scss

.header {
	width: 100%;
	position: fixed;
	&[type="checkbox"]{
		display: none;
	}

в css компилируется

.header {
  width: 100%;
  position: fixed;
}
.header[type=checkbox] {
  display: none;
}

нужно чтобы в css было type="checkbox" был с кавычками

.header[type="checkbox"] {
  display: none;
}

Comments

[Сергей delphinpro]

Для оформления исходного кода используйте тег < code> а не цитирование.

[Сергей delphinpro]

нужно чтобы в css было type="checkbox" был с кавычками

Кому нужно? И зачем?

Answer 1

[iBird Rose]

Это нормальное поведение. Компилятор не оборачивает в кавычки, когда они не нужны. Потому что .header[type=checkbox] эквивалентен .header[type="checkbox"]
А вот если ты напишешь какой-нибудь [type="checkbox*1"] - он его обернет в кавычки. ибо теперь они нужны.

Comments

[pashjka]

спасибо за пояснения, проблема при которой код не работал, была в отсутствующем пробеле

Answer 2

[pashjka]

ошибку нашел сам
проблема была в синтаксисе:
не хватало пробела перед квадратной скобкой - "["

было
.header[type=checkbox] {
display: none;
}
стало
.header [type=checkbox] {
display: none;
}

работает и без кавычек, они не нужны