[Html] 라디오버튼이나 체크박스를 텍스트와 줄 맞추기

<INPUT type=radio>아하하
<INPUT type=checkbox>아하하

라디오버튼이나 체크박스 텍스트와 줄이 안맞아서
보통 td를 나눠서 줄을 맞추곤 했었는데 아래 소스 처럼 하면 간단히 해결이 되는군요;;

<INPUT style="MARGIN: 0px 3px 1px 0px; WIDTH: 13px; HEIGHT: 13px" type=radio>아하하
<INPUT style="MARGIN: 0px 3px 1px 0px; WIDTH: 13px; HEIGHT: 13px" type=checkbox>아하하

세밀하게 맞출때는

<input type="radio" style="vertical-align: 3px" checked>아하하
<input type="radio" style="vertical-align: 0px">아하하
<input type="radio" style="vertical-align: -5px">아하하

이렇게 vertical-align 속성으로 조절해도 편리하지요..

 

------------------------------------------------------------------------------------------------------------------------------------------------

 

또 예를들어 익스에서는 vertical-align: 3px 하면 맞지만 파이어폭스에서는 vertical-align: 4px 해야 맞더라!

그럴때는,

<style type="text/css">
    .huh { vertical-align: 4px; }
    * html .huh { vertical-align: 3px; }
</style>
<input type="radio" class="huh">아하하

이런식으로 두 브라우저간의 약간의 차이를 줄일 수도 있습니다

자세한건 구글에서 css ie hack 같은 검색어를 넣어보셔요

 

 

출처 : 사이트 사라짐