사파리에서만 특정 css 주기

배포 후 아이폰에서 확인하니 select 박스가 개똥같이 나온다. -webkit-으로 css 안 맞춰서 그런것.

-webkit-appearence: none; 해주니까 먹히긴 하는데 미묘한 내부 padding 차이…(왼 크롬, 우 사파리)

사파리에서만 특정 css를 줄 수 있는 방법을 찾아야한다. 해서 처음에 나온건

@media not all and (min-resolution: 0.001dpcm) {
  @supports (-webkit-appearance: none) {
    select {
      -webkit-appearance: none;
      padding: 10px;
    }
  }
}

근데 아모고토 안 먹힌다. 지피티한테 물어보니까 이건 사파리 12버전 이하에서나 먹히던 구닥다리 방식이라 한다. 지금은 아래같이 해야 먹힌다고 함.

@supports (-webkit-backdrop-filter: none) {
  select {
    -webkit-appearance: none;
    padding: 10px;
  }
}

편-안