양식 내의 라디오 버튼 레이블 스타일

라디오 버튼 레이블을 검색 상자 및 찾기 버튼과 같은 줄에두기 위해 어떻게 스타일을 지정할 수 있습니까? 나는 또한 텍스트 상자 값 "주소 입력 ...."스타일을 지정하고 싶습니다. 감사합니다!양식 내의 라디오 버튼 레이블 스타일

CSS

.reportText_font { 
     font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; 
     font-size: 12px; 
     font-style: normal; 
     color: #333;  
    } 
    form { 
     display: inline; 
     } 
    #searchArea { 
     margin-left:35px; 
     height: 22px; 
     }

HTML

<div id = "searchArea"> 
     <input id ="address" size="38" style="color:#333" value="Enter address (including state) or ZIP code" onfocus="if(this.value==this.defaultValue) this.value='';"/> 
     <button id="locate" data-dojo-type="dijit/form/Button">Locate</button> 
     <form> 
      <input type="radio" name="template" value="1" id="res" checked>Residential 
      <input type="radio" name="template" value="2" id="com">Commercial 
     </form> 
</div>

http://jsfiddle.net/6fRkc/3/

출처

2014-07-22 Andrew

음, 어떻게 텍스트 상자의 스타일을 하시겠습니까? 또한 라디오 버튼이 텍스트 상자와 버튼과 같은 줄에있는 것처럼 보일 수 있지만, 피들의 창 너비를 조정하면 더 낮은 행으로 재배치됩니다. 그것은 당신이 피하려고하는 것입니까? – MattD

안녕하세요.

를 사용하여 입력 유형 행을 넣었을 때 텍스트를 올바르게 형식화하지만 다음 행으로 푸시합니다. http://jsfiddle.net/6fRkc/4/ – Andrew

나는 라디오 버튼 레이블에서 작동하도록했습니다.

CSS와 <input>...</input> 라인 싸는

label[for=res], label[for=com]{ 
    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; 
    font-size: 12px; 
    font-style: normal; 
    color: #333; 
} 


<form> 
     <input type="radio" name="template" value="1" id="res" checked> 
     <label for="res">Residential</label>&nbsp;&nbsp; 
     <input type="radio" name="template" value="2" id="com"> 
     <label for="com">Commercial</label> 
    </form>

출처

2014-07-22 19:45:01 Andrew

대상이 특정의 라인을 따라 라디오 버튼 당신이하고 싶은 것입니다 :

input[type="radio"]

물론 모든 라디오 버튼을 선택하지 않는 것이 더 구체적 일 것입니다. 세로로 상단에 정렬 한 다음 상단에 여백을 적용하여 필요한만큼 드롭합니다. 이렇게하면 다른 모든 텍스트가 그대로 유지되고 라디오 버튼 만 이동합니다.

출처

2014-07-22 19:31:12 TheHamstring

외부 컨테이너의 선택기에 white-space: nowrap을 추가하면 모든 내용이 같은 줄에 있어야합니다.

#searchArea { 
    margin-left:35px; 
    height: 22px; 
    white-space: nowrap; 
}

출처

2014-07-22 19:37:04 x23

<span class="reportText_font"></span>

출처

2014-07-22 22:33:17 Zac

양식 내의 라디오 버튼 레이블 스타일

답변

관련 문제