2014-04-03 2 views
0

내 모바일 메뉴에 대해 다음 CSS 규칙이 있지만 문제는 내 데스크톱 브라우저 (크롬, 파이어 폭스 IE 등)휴대 기기에서 내 CSS 규칙을 무시합니다. 이유는 무엇입니까?

CSS 규칙에 내 모바일 장치의 위치보다 문을 무시하지만,하지 :

background:#000 url("images/nav-icon.png") no-repeat;background-position: 
right 15px top 10px; (DISPLAYED AT THE TOP LEFT *) 

이러한 조합을 사용해보십시오. 모바일 장치

background-image:url("images/nav-icon.png");background-repeat:no-repeat; 
background-position:right 15px top 10px; (DISPLAYED AT THE TOP LEFT *) 

background:#000 url("images/nav-icon.png") right 15px top 10px no-repeat; 
(NOT DISPLAYED AT ALL *) 

* .

그 중 하나는 전혀 표시되지 않지만 두 개는 왼쪽 상단에 표시됩니다. 위의 것을보십시오.

이제 내 질문에 내 조합에 문제가 있습니까? 아니면 모바일 장치가 이러한 조합을 지원하지 않습니까? adavance 잭

답변

0

에서

덕분에 일부 모바일 장치는 할 수 없습니다. 즉 iPhone 또는 Webkit 브라우저.

다른 방법을 찾아보십시오 (Google을 사용하는 경우 많은 CSS 해킹이 있습니다) 또는 자바 스크립트를 사용하십시오!

여러 장치에서 웹 사이트를 테스트했는지 확인하십시오. Future Shop 또는 Bestbuy에 가서 태블릿, 대형 스크린 컴퓨터 및 일련의 모바일 장치에 내 반응 웹 사이트/웹 앱을 테스트합니다.

0

4 가지 값 구문으로 배경 위치를 지정해야합니까? 여전히 open proposal입니다. 적용 할 요소 너비를 알고 있으면 백분율 값을 사용하여 오른쪽에서 설정할 수 있습니다.

아마 가장 좋은 방법은 div 요소 내부 스팬 요소를 만들고, 당신이에 배경을 적용하려고하는 경우 대신 배경 이미지

의 스팬 요소를 배치하는 것 범위를 지정하려면 display: block; 또는 이와 비슷한 값을 지정해야합니다. 따라서이 경우 div를 사용하고 뒤에있는 요소의 z- 인덱스 아래에 절대적으로 위치시킬 수도 있습니다. 그 (것)들 position: relative;z-index 일을 만든다

관련 문제