[재질문] IE는 되는데 크롬/엣지 라디오버튼 ID값 작동 안됨.
본문
<style type="text/css">
#el02 {color:#00f;background-color:#ddd;}
#el05 {border:2px dotted #00f}
</style>
<td>
<input type='radio' name='ansewer<?=$i?>' value='<?=$k?>'
<? if($selectedAnswer==$k) {
echo " checked";
if($exAnswerList[$selectedIndex]==$selectedAnswer) {
echo " id=\"el05\""; // 크롬, 엣지는 먹질않음
}
} else {
if($exAnswerList[$selectedIndex]==$k) {
echo " id=\"el02\""; // 크롬, 엣지는 먹질않음
}
} ?> />
</td>
아래 이미지를 보면 IE는 id값 배경 및 닷선 잘먹는 데... 크롬/엣지는 먹질 않습니다.
크롬/엣지는 다른 style이 있나요?
오류나 방법 좀 알려 주시면 감사드림.
참고로 엣지 소스에는 id값이 있음.
어제 답변
유찬아빠 님의 답변
id 말고 class로 해봐도 그런가요?
----------/----------
안됨.
답변 2
예제입니다. 알아서 응용해 보세요
<style>
.my-span { border:2px dotted transparent; width:15px; height:15px; display:flex;justify-content:center; align-items:center; float:left; margin-right:5px; }
</style>
<div id=myDiv>
<span class=my-span><input type=radio style=margin:0px name=you></span>
<span class=my-span><input type=radio style=margin:0px name=you></span>
<span class=my-span><input type=radio style=margin:0px name=you></span>
<span class=my-span><input type=radio style=margin:0px name=you></span>
</div>
<script>
my = myDiv.getElementsByClassName("my-span");
myName = document.getElementsByName("you");
for (i = 0; i < myName.length; i++) {
myName[i].num = i;
myName[i].onclick = function() {
for (j = 0; j < my.length; j++) my[j].style.borderColor = "transparent";
if (this.checked) my[this.num].style.borderColor = "#0000ff";
}
}
</script>
실례가 되지 않는다면...
IE 는 포기하시는 것이 정신건강에 이롭습니다.
냑에는 이걸 해결해드릴 고수분들이 많지만 대부분의 분들이 IE 를 삭제하셨을 것입니다.
질문 하나 답해 주려고 IE 를 다시 설치할 분은 아마도 없으실 거에요.
저 역시 마찬가지로 IE 가 없습니다.
코드 자체를 가장 레거시하게 구성해서 이렇게 하면 IE 에도 맞을 거란 생각하에 짜 본 것입니다.
실레는요... 답변 감사합니다.
IE를 포기를 할려고 문의 한 겁니다.
IE는 스타일이 먹는 데... 엣지/크롬이 먹지 않아서요.
위 코드 잘 적용해 볼게요.
크롬에서 input박스나 select박스등 style에 제한이 있습니다
보통 input radio를 style할때는 해당 박스는 숨겨두고 스타일을 지정하고합니다
참고자료
https://webdesign.tutsplus.com/ko/articles/quick-tip-easy-css3-checkboxes-and-radio-buttons--webdesign-8953
IE가 이상한거지 보통 브라우저에서 기본 radio스타일에 대한 변경은 잘 지원하지않습니다
특히 select박스의 경우가 그렇지요 각 브라우저마다 보이는게 조금씩 다르거든요
그래서 자신만의 커스텀 select,raido을 원하는경우 원래보이는 폼은 숨기고 영역을 따로 만들어서 해당 영역에 style하고 기능을 넣어주는 방식을 많이 택합니다
답변 감사합니다.
어렵군요.
계속 봐도 이해를 못하겠음.
