ABOUT ME

-

Today
-
Yesterday
-
Total
-
  • IE8 버그 : 특정 셀렉트 박스 만 마우스오버시 닫히는 버그
    FrontEnd/버그리포트 2015. 6. 12. 17:31

    특정 셀렉트박스에서만 마우스를 올렸다가 움직이면 닫혀버리는(blur)현상이 나왔다.



    원래 셀렉트박스 버그는 hover background 버그는 알고 있었는데

    참고 : http://jpss.ta3ke.com/118


    일단 셀렉트박스에 가상클래스(pseudo-class)부터 확인했지만 그런건 없다.


    이렇게 되면 직업적 윤리에 맞게 당연히 삽질을 시작했다.




    삽질기


    1. 상단의 인풋 라디오를 지우면 현상이 없어진다.

    => 하지만 라디오버튼을 지울수는 없는 상황이다..

    => 이건 왜인지 모르겠다.



    2. 인풋 라디오버튼의 위치가 버그셀렉트 보다 DOM구조상 위에 있으면 현상이 발생한다.

    => 아래에 다가 놓고 CSS을 수정해도 되지만 귀찮다.

    => 이것도 모르겠다.




    그러다가 아래의 삽질기를 발견!



    ie's select boxes closes themselves when hovering


    구글의 힘을 빌어 번역해보면 , Ie8에서만, 로컬말고, 원격서버에서만 닫히는 현상이 있다.


    위의 글 댓글을 보다가 자꾸 애들이 폰트페밀리로 장난질을 하길래. 


    IE8 에서 select에 폰트페밀리는 적용이 안된다. 라는걸 전 프로젝트에서 해봤어서 화면을 봤는데


    잉? 적용이 되어있네?


    그래서 CSS을 급하게 분해했다.


    그런데 우리가 설정한건 나눔고딕인데, 맑은고딕이 적용되어있음을 확인.


    그래도 이상한데...


    하면서 font-fmaily가 적용되어있는걸 지우니...


    기능이 동작...


    그러는 중에 댓글 발견..



    It looks like it might be a few different CSS declarations that can cause this.


    I was having the same problem but no color declaration. 

    It turns out that it was a font-family rule.

    I used a conditional comment to target IE8 and older and set the font-family to "inherit." Padding works fine, as does font-size.



    그냥 짧게 줄이면 "나도 IE8 셀렉트버그가 있었는데, 컬러값 적용이 없었다. 하지만 폰트페밀리 적용이 있었어서 이제는 IE8일때만 "inherit" 로 폰트페밀리가 적용되도록한다."


    라는거다.





    결론


    그냥 select에는 font-family적용하지 말자.

    TAG

    댓글 0

Designed by Tistory.