CSS : "권리"속성은 적용을 거부합니까?

이것은 나를 미치게합니다!CSS : "권리"속성은 적용을 거부합니까?

본문 태그 바로 뒤에 두 개의 div가 있습니다. 그것들은 절대적인 위치와 크기를가집니다. 그들은 둘 다 동일한 "왼쪽"속성을 가지고 있지만 나중에 두 번째 div에 대한 "올바른"속성을 선언합니다 (그래서 "왼쪽"은 무시해야합니다!).

<body> 

<div class="previousPageButton"></div> 
<div class="nextPageButton"></div>

그리고 CSS : 여기

는 HTML입니다 (거기에 더 코드입니다하지만 관련이없는, 그래서 그것은 주석입니다.)

.previousPageButton, .nextPageButton { 
    position: absolute; 
    top: 0px; left: 0px; 
    display: block; 
    height: 500px;; 
    width: 100px; 
    background: transparent url(../images/buttons/arrow_previousPage.png) no-repeat center center; 
    z-index: 2; 
    opacity: .1; 
} 

.nextPageButton { 
    top: 0px; right: 150px; 
    background: transparent url(../images/buttons/arrow_nextPage.png) no-repeat center center; 
}

당신이 볼 수 있듯이, 첫 번째 CSS BELOW 여기서 "left"를 선언하면 .nextPageButton의 "right"속성을 명시 적으로 선언하는 또 다른 CSS 블록이 있습니다. 몸은 평소대로 상대적으로 배치되므로 잘 작동합니다! "right"속성을 선언하기 전에 "left"속성을 "설정 해제"해야합니까? 그게 가능한가?

나는 첫 번째 코드 블록에서 "왼쪽"속성을 찢어 버릴 수 있고 각 div에 자신의 왼쪽/오른쪽 속성을 할당 할 수 있다는 것을 알고있다. 그러나 이것은 여전히 작동해야한다!

의견이 있으십니까?

출처

2011-05-09 qwerty

jsfiddle 및 firebug를 사용하면 left : 속성 만 제거하면됩니다. http://jsfiddle.net/sCgsF/1/ – David

Typo : height : 500px ;; – Marcel

left 및 right은 상호 배타적 인 것이 아닙니다.

요소는 left 및 right 속성 집합을 모두 가질 수 있습니다 (like this).

left을 "제거"/ "재설정"하려면 left: auto을 적용해야합니다.

속성의 "초기 값"을 검색 할 수 있습니다 (예 : here's left).

출처

2011-05-09 17:08:14 thirtydot

감사합니다. (최대한 빨리 받아 들일 것입니다!) – qwerty

"하단"속성과 동일한 문제가 있습니다. jsfiddle.net/sCgsF/2/ 꼬리말의 CSS입니다. 다른 것을 선언하지 않았습니다. 그리고 어떤 이유인지 그것은 단지 비어 있습니다. 어떤 아이디어? 자동으로 상단 설정을 시도했지만 지금은 그 요소에 전혀 상위 속성을 설정하지 않았으므로 중요하지 않아야합니다. 아래쪽 공헌을 뭔가 음수로 설정하면 몸체 높이가 0 인 것처럼 페이지 상단에서 나타납니다. 아이디어? – qwerty

이게 이거 야 : http://jsfiddle.net/sCgsF/3/? 그렇지 않다면, 나는 당신이 무엇을 요구하고 있는지 정말로 이해하지 못합니다. – thirtydot

충돌을 일으키는 일부 상속이 있습니다. 방지하기 위해 .nextPageButton 클래스에 left: auto;을 추가하십시오.

출처

2011-05-09 17:07:55

CSS : "권리"속성은 적용을 거부합니까?

답변

관련 문제