웹개발 및 최신 테크 소식을 전하는 블로그, 웹이즈프리
문제는 다른 브라우저의 경우 클릭이 잘 되나 Firefox(파이어폭스)에서 button 태그안에 위치한 a 태그가 클릭이 안된다는 점입니다... 하지만, button 태그안에 a 태그를 사용하는 것이 올바른 방법은 아니기에 이 문제를 해결하기 위한 방법은 크게 두가지 입니다.
# 기존
<button><a href="/">TEST</a></button>
# 수정 후
<a href="/"><button>TEST</button></a>
가장 올바른 방법입니다. 물론 CSS 스타일이 적용되었다면 수정해야하죠.
# 기존
<button><a href="/">TEST</a></button>
# 수정 후
<form>
<button type="submit" formaction="/">TEST</button>
</form>
a 태그는 필요가 없기에 삭제하였습니다. 사실 방법이라기 보다 꼼수인데요... 버튼 태그의 formaction 속성을 이용하는 것이지요... 간단하지만 태그의 본래과는 다르겠군요 :)
하나. a 태그를 버튼 밖으로 이동
# 기존
<button><a href="/">TEST</a></button>
# 수정 후
<a href="/"><button>TEST</button></a>
가장 올바른 방법입니다. 물론 CSS 스타일이 적용되었다면 수정해야하죠.
둘. form 태그를 사용한 방법
# 기존
<button><a href="/">TEST</a></button>
# 수정 후
<form>
</form>
a 태그는 필요가 없기에 삭제하였습니다. 사실 방법이라기 보다 꼼수인데요... 버튼 태그의 formaction 속성을 이용하는 것이지요... 간단하지만 태그의 본래과는 다르겠군요 :)
아래의 글도 찾고 계시지 않나요?
