안녕하세요. 현재 부트스트랩 btn btn-primary btn-block 버튼을 사용중입니다.

위 사진 중 윗부분 버튼 코드입니다. 부트스트랩 기존 버튼 안에 a 태그를 삽입해 버튼안의 글자를 클릭하면 설정한 링크로 연결되게 했습니다.
Copy
<button class="btn btn-primary btn-block" type="button"><a href="">버튼</a></button><button class="btn btn-primary btn-block" type="button"><a href="">버튼</a></button>
그런데 이렇게하니 버튼이 길어질경우 글자를 클릭해야만 링크가 작동하는게 불편해서 버튼을 클릭하면 링크로 연결되도록 아래처럼 바꿨습니다. 그랬더니 사진의 아랫부분처럼 버튼 두개가 자동으로 붙어버리네요...!
Copy
<a href=""><button class="btn btn-primary btn-block" type="button">버튼</button></a><a href=""><button class="btn btn-primary btn-block" type="button">버튼</button></a>
혹시 이 현상이 왜 일어나는지, 어떻게 고칠수있는지 아는분 계시면 도와주신다면 정말 감사하겠습니다!
답변 2개 / 댓글 1개
채택된 답변
+20 포인트
사노라가노라
2016-10-31 (월) 01:34:55
<a href="url" class="btn btn-primary btn-block" role="button">링크1</a>
<a href="url" class="btn btn-primary btn-block" role="button">링크2</a>
적용 후 확인
답변에 대한 댓글 1개
firsttiemuser
2016-10-31 (월) 01:46:41
감사합니다! type="button" 말고 role="button"으로 해야하나요?
돼지코구뇽
2016-10-31 (월) 04:25:44
<a> 태그와 <button> 태그 둘다 링크나 버튼형식에 태그입니다 둘이 같이 사용하지 않습니다.
답변을 작성하려면 로그인이 필요합니다.