스팬 여백을 사용하여 텍스트 맞추기

Question

HTML에 익숙하지 않으므로 추가 설명이 필요하거나이 질문이 의미가 없으면 그렇게 말하십시오.

div를 사용하여 webform을 디자인했습니다. & nbsp를 사용하여 div 내에서 텍스트를 이동하면 항상 페이지의 레이아웃까지 원하는 결과를 생성하지 않습니다.

<span style="margin-left:(variable)px"></span> 

난 내가 원하는 곳에 정확하게 텍스트를 이동할 수 있어요 :

나는 실험 및 사용하여 시작했다.

제 질문은 이것이 나쁜 습관입니까? 제가하려고하는 일, 또는보다 전통적인 방법으로 할 수있는 더 좋은 방법이 있습니까? 또는 html로 만들어진 무언가조차도 아직 발견하지 못했습니다.

내가 레이아웃 비 깨뜨릴 수있는 공간을 사용

Complainant's Address 
    <input type="text" size="50" id="complainantAddress"/> 
    <span style="margin-left:3px"></span> 
    City 
    <input type="text" name="city" maxlength="15" size="15"/> 
    <span style="margin-left:16px"></span> 
    State 
    </div> 

Answer 1

를 달성하기 위해 노력하고 무엇을 보여주기 위해 코드의 * 추가 블록 당신에게

감사/위치 나쁜 방법입니다. style 속성으로 수행하려고 시도하는 것이 더 좋지만, 인라인 스타일 속성은 종종 불량으로 간주됩니다.
스타일 속성은 유지하기 어렵고 많은 정보를 복제합니다. 또한이 스타일은 가장 높은 특수성을 가지며 다른 스타일 (예 : 사용자 CSS 파일)으로 덮어 쓸 수 없습니다. 주의해서 사용해야합니다.

CSS 속성 margin, padding 및 text-align을 사용하십시오.

샘플
http://jsfiddle.net/UYUA7/

HTML

Text<br /> 

&nbsp;&nbsp;&nbsp;&nbsp;Text <!-- Do NOT use this --> 

<div class="center">Center</div> 
<div class="right">Right</div> 
<div class="indent">Indented</div> 

.center { 
    text-align: center; 
} 

.right { 
    text-align: right; 
} 

.indent { 
    margin-left: 20px; 
} 

Answer 2

은 당신이하고있는 것은 실제로 더 나은 서호주 CSS y는 간격을두기보다는 & nbsps에 의존합니다. 이렇게하면 장기간에 훨씬 더 큰 유연성을 얻을 수 있으며 변경을 더 빨리 할 수 ​​있습니다. 내가 추천 할 것입니다 (이하 입력)

유일한 다른 점은이 CSS 설명서를 읽을 수 있습니다 :

http://www.w3schools.com/css/css_intro.asp

이것은 당신이 CSS와 위치에 대해 배울 계속 도움이 될 것입니다.

UPDATE :

이 코드를 같이 할 것입니다 :

CSS - 헤더

<style type="text/css"> 
#complainantAddress { 
    margin-right: 3px; 
} 

#city { 
    margin-right: 16px; 
} 
</style> 

HTML

Complainant's Address: <input type="text" size="50" id="complainantAddress"/> 
City: <input type="text" name="city" maxlength="15" size="15" id="city"/> 

공지 사항에서 사용 나는 일치하는 입력 상자마다 하나씩 두 개의 CSS 스타일을 만들었습니다. 각 스타일 내에서 입력 상자의 오른쪽에 적절한 간격을 추가하는 여백을 정의했습니다.

"complainantAddress"라는 첫 번째 입력란은 오른쪽으로 3px 간격을 가지며 id가 "city"인 두 번째 입력란 오른쪽에 16px 간격을 갖습니다.