영혼과영혼의양식

아래 예제처럼 테이블안에 테이블을 사용하는 경우 안쪽테이블 바깥에 Form문을 주게 되면 안쪽테이블 다음에 공백의 줄이 생겨서 디자인이 흐트러지는 경우가 많습니다.

 <table border="1"><tr><td>
    <form>
        <table border="1">
            <tr>
                <td>테스트입니다.</td>
            </tr>
        </table>
    </form>
</td></tr></table>

 그래서 보통 디자인이 흐트러지는것을 막기위해서  TABLE태그 사이에 Form문을 넣어서 사용을 많이 하곤 하죠.

<table border="1">
    <tr><td>
        <table border="1">
            <form>
                <tr>
                    <td>테스트입니다.</td>
                </tr>
            </form>
        </table>
    </td></tr>
</table>

 하지만 여러개의 테이블을 사용하다보면 Form문의 여는태그와 닫는태그의 순서가 맞지 않게 프로그래밍 해야만 하는 경우가 있습니다.  이경우 페이지는 제대로 보이지만  문법상 분명히 잘못된 것이죠.

 <table border="1">
    <tr> <td>
            <table border="1">
                <form>
                    <tr>
                        <td>테스트입니다.</td>
                    </tr>
            </table>
            <table border="1">
                    <tr>
                        <td>테스트입니다.</td>
                    </tr>
                </form>
            </table>
        </td></tr>
</table>
 

이럴때 Table태그 안에 Form태그를 넣지 않고 바깥에 넣어서 사용할수 있는 방법이 있습니다.
공백이 생기는 것은 Form문의 display속성이 기본으로 block으로 되어 있기 때문인데요, 
스타일시트로  아래처럼 사용하면 한번에 해결할수 있습니다.

 <style> form { display : inline ; } </style>

 또는  <style> form { margin : 0px ; } </style>  으로도 똑같은 효과를 볼수 있다고 하네요.


[출처] : http://blog.naver.com/siva6/120018547117