2017-11-23 27 views
3

Firefox를 업데이트 한 후 firefox의 UI 컨트롤의 일부로 입력에 작은 (x) 버튼이 나타납니다.Firefox Quantum (57) <input type = "date"> UI 닫기/삭제 버튼 숨기기

CSS를 사용하여이 버튼을 숨기거나 제거 할 수있는 방법이 있습니까?

현재 모질라의 파이어 폭스 입력 날짜 웹 페이지에이를 볼 수 있습니다 https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/date

또는 뷰 이미지 here

+0

저렴한 샷은 맞춤 날짜 피커 (th ere가 많은 libs/snippets) 또는 더 값싼 요소는 요소를 텍스트 입력으로 설정하는 것이지만 자리 표시 자에 올바른 날짜 형식을 넣어 사용자가 가져 오도록하십시오. 이상적은 아니지만 그 똥은 입력 요소에 포함되어 있으며 제거하기 위해 하드 AF처럼 보입니다. 이전에는 웹킷 선택기가 있었지만 더 이상 작동하지 않는 웹킷 선택기가있었습니다. 그 작은 요소 이후 최대의 anoying 그것은 절반의 공간을 필요로합니다 – DanteTheSmith

+0

내가 다른 대답이 없다면 나는 이것을 할 수 있습니다, 그래도 좋지 않을 것입니다 :) – HKG

+0

당신의 질문에 대답 해 주시기 바랍니다. 다른 사람보다 먼저 해결책을 찾으십시오. 나는 질문을 제기했다. 희망을 갖고 누군가는 이것을 더 부드럽게하는 법을 알 것이다. 그러나 솔루션의 유지 관리 가능성에 대한 두려움 때문에 맞춤식 datepickers를 사용해야합니다. – DanteTheSmith

답변

1

클립 경로가 당신이 그것을 사용할 수있는 원유 접근 방식은 작동합니다

input[type=date] { 
    border: 0; 
    clip-path: inset(0 17px 0 0); 
    width: 120px 
} 

https://jsfiddle.net/21zwe8yu/

+0

이것은 효과가 있으며 말한 그대로입니다. 참고로 누군가를 읽으려면 firefox 브라우저를 대상으로 J를 사용해야 할 수도 있습니다. 크롬과 마우스 오버 스타일에서 잘 작동하지 않기 때문입니다. 입력 내용 내부의 요소와 충돌하기 때문에 이것을 답으로 사용하기를 꺼립니다. – HKG

+1

그래, 나는 동의한다. 이것은 내가 가지고 올 수있는 최선의 것입니다. 그리고이 문제가 발생했을 때 나는 궁극적으로이 솔루션을 직접 사용하지 못했습니다. 방금 입력 한 날짜에 대해 기본 입력란을 사용하여 다른 입력에 적용한 사용자 정의 JS 기반의 클리어 필드에서 날짜 입력을 포기하고 면제했습니다. 그럼에도 불구하고 어떤 사람들은 내가 생각했던 것보다 완전히 사용자 정의 된 입력란을 만드는 토끼 구멍을 깊이 파고 들기에 관심이있을 것이라고 생각했습니다.이 접근법은 사람들이 거기에 도달하는 데 도움이 될 수 있으므로 궁극적으로 나 자신을 사용하는 것을 거부했지만, 뿐만 아니라 그것을 게시 할 수 있습니다. – kethinov