css { margin:0 0 0 0; } 마진값으로 input 위치설정

<style>
.input { margin:0 0 0 0; }
</style>

 

margin:0 0 0 0;

 

순서대로.. 0 0 0 0;

상단에서의 여백, 우측에서의 여백, 하단에서의 여백, 좌측에서의 여백

시계가 돌아가는 방향으로 12시(상) 3시(우) 6시(하) 9시(좌) 으로 생각하면 쉽다.

 

input박스를 기준으로 여백이 생기는 것이다.

 

만약 50 0 0 0; 이라면..

input박스 상단에 50의 여백이 생겨 아래로 밀려난다..

 

0 50 0 0; 이라면..

input박스 우측에 50의 여백이 생겨 input박스 우측에 있는 것이 밀려난다. input박스가 움직이는 것이 아니다.

 

0 0 50 0; 이라면..

input박스 하단에 50의 여백이 생겨  input박스 양쪽에 있는 것이 아래로 밀려난다. input박스가 움직이는 것이 아니다.

 

0 0 0 50; 이라면..

input박스 좌측에 50의 여백이 생겨  input박스가 우측으로 밀려난다.

 

 

 

아래처럼 테스트해보시면 쉽게 이해가 됩니다. margin 값을 수정하면서 테스트.

 

<style>
.input { margin:0 0 0 0; }
</style>

테스트 <input type="text" class="input"> 테스트