2012-11-23 3 views
1

배경 크기 400 %의 선형 그래디언트를 사용하고 있습니다. 이를 통해 백그라운드 위치를 변경하여 호버 및 활성 상태의 그라데이션간에 애니메이션을 적용 할 수 있습니다. 그것은 웹킷에서 잘 작동하지만 파이어 폭스에서는 그렇지 않습니다. background-size 속성이 전혀 인정되지 않는 것 같습니다.파이어 폭스에서 선형 그래디언트 + 배경 크기가 작동하지 않습니다.

Firefox는 기본적으로 백그라운드 크기가 100 %로 설정된 것처럼 요소의 전체 그라디언트를 축소합니다.

임 구배 모든 적절한 벤더 접두사를 사용

http://firefoxgradient.s.cboo.st

(그 차이를 볼 파이어 폭스 웹킷 w/B 스위치)

필자 문제를 보여주는 매우 간단한 페이지있어 및 배경 크기.

나는 이미지의 배경 크기가 어긋나고 예상대로 동작했다. 그라디언트 특정 문제 일 수 있습니다.

답변

3

문제는 파이어 폭스에 background-size에는 너비와 높이 중 하나에 대해 두 가지 값이 있다는 것입니다. 당신이 이렇게하면 : background-size: 400% 파이어 폭스는 background-size: 400% auto로 번역합니다. auto는 높이 값입니다. 그것을 고치는 것은 단지 쓰기를한다 : -moz-background-size: 400% 400% 이것은 나를 위해 일한다.

+0

그것은 그렇게 분명했습니다. 웹킷은 우리를 망친다. –

+1

WebKit의 기능은 http://www.w3.org/TR/css3-background/#the-background-size에있는 사양을 따르지 않고 백그라운드 크기의 단일 값이 어떻게 작동해야하는지에 대해 명확하게 설명합니다. . 물론 당신은 합법적으로 사양을 따르지 않을 수 있습니다 접두사 버전을 사용할 수 있습니다 .... –

관련 문제