양식 레이아웃을위한 CSS 클래스 덮어 쓰기

-1

아래의 CSS를 사용하여 테이블을 사용하지 않고 올바르게 정렬 된 양식을 만듭니다. 유일한 문제는 필드 중 하나에 여러 개의 "옵션"이있어 그 옆에 표시해야한다는 것입니다. 특정 필드 옆에있는 항목에 어떤 스타일을 추가하여 "인라인 블록"으로 표시되지 않도록 할 수 있습니까?양식 레이아웃을위한 CSS 클래스 덮어 쓰기

label { 
    display: inline-block; 
    float: left; 
    clear: left; 
    width: 180px; 
    text-align: right; 
    padding-right: 5px; 
} 

input { 
    display: inline-block; 
    float: left; 
    width: 165px; 
    margin-bottom: 2px; 
}

출처

2013-08-06 BryceKrispies

질문을 명확하게 할 수 있습니까? 아마도 [jsFiddle] (http://www.jsfiddle.net) 예제를 가지고있을 것입니다. "옵션"이란 무엇을 의미합니까? – EZSlaver

인라인 블록이 표시되지 않도록 여분의 클래스를 여러 옵션이있는 필드에 추가하기 만하면됩니까? – eclipsis

항목에 ID를 지정하십시오.

ID는보다 구체적이므로 일반적인 요소 또는 클래스 문보다 우선합니다. 예를 들어 div에있는 항목을 id="myItems"으로 바꿀 수 있고 위의 규칙 뒤에 다음 CSS 규칙을 추가 할 수 있습니다.

 
input#myItems { 
    display: block; 
}

출처

2013-08-06 23:52:10

정확히 무엇을 묻고 있는지 확실하지 않을 수 있습니다.

특정 요소에 대한 CSS 스타일을 재정의하려면 !important 선언을 사용할 수 있습니다.

예 :

는

li { 
    background-color: #000; 
} 

/*A specific list to have a white background*/ 

.specific { 
    background-color: #fff !important; 
}

다른 모든 양식화 우선합니다 !important 태그/상속합니다. http://css-tricks.com/when-using-important-is-the-right-choice/

출처

2013-08-06 22:09:31

양식 레이아웃을위한 CSS 클래스 덮어 쓰기

답변

관련 문제