2014-12-24 4 views
2

나는이 사이트 및 다른 브라우저에서 내 CSS를 변경하는 방법에 대해 광범위하게 읽었지만 찾은 방법 중 아무 것도 작동하지 않습니다.파이어 폭스에 대한 CSS 변경

목록 항목이 다른 브라우저에서 다른 크기의 패딩으로 나타나는 정렬되지 않은 목록이 있습니다. 값은 8 px로 설정되며 크롬 및 사파리에서 완벽하게 작동합니다. 나는

ul.titles li { 

padding: 8px; 
-moz-padding: 7px; 
font-family:"Subway", "Courier New", "serif"; 
font-size:11; 
color: #000000; 
} 

가 나는 또한이 두
ul.titles li { 

padding: 8px; 
padding: -moz-7px; 
font-family:"Subway", "Courier New", "serif"; 
font-size:11; 
color: #000000; 
} 

을 시도 영향을 미치지 아니 노력했다. 내가 -webkit-과 -moz-를 정의하려고 시도했을 때, 모질라와 크롬을 엉망으로 만들었다.

+1

CSS 재설정 또는 노말 라이저로 CSS를 시작해야합니다. – ceejayoz

+0

이 스레드는 관련이있을 수 있습니다. http://stackoverflow.com/questions/5370609/difference-between-firefox-and-chrome-padding – AndrewH

+1

가능한 [firefox 필드 용 브라우저 특정 CSS 패딩] (http://stackoverflow.com/questions/19569399/browser) -specific-css-padding-for-firefox-field) –

답변

1

시도 모질라 확장의 내부에 스타일을 추가로 class를 추가 otherwrite : 그래서

@-moz-document url-prefix() { 
    /* Styles go here */ 
} 

귀하의 경우 CSS 스타일 시트에 다음 코드 행을 추가 할 수 있습니다.

@-moz-document url-prefix() { 
    ul.titles li { 
     padding: 8px; 
     font-family:"Subway", "Courier New", "serif"; 
     font-size:11; 
     color: #000000; 
    } 
} 

또 다른 옵션은 Normalize.css입니다. 브라우저에서 모든 요소를보다 일관되고 현대적인 표준에 맞게 렌더링 할 수 있습니다. 정규화가 필요한 스타일 만 정확하게 타겟팅합니다. 나는 그것을 매우 추천한다. 대신 하나 모든 브라우저를 주소의

+1

이것은 또 다른 하나입니다. 내가 URL 접두어로 입력 한 결과가 없습니다. (지금 아파치로 작업하고 있습니다.) @ -moz-document localhost { ul.titles li { 패딩 : 6px; font-family : "Subway", "Courier New", "serif"; font-size : 11; 색상 : # 000000; } } –

+1

@JonathanBasile, 그것은 당신처럼 작동하지 않습니다. 스타일 시트에 CSS 코드를 복사하고 스타일을'url-prefix()'다음에 오는 괄호 안에 넣으면 FireFox에서 서식이 지정됩니다. – Luke

+1

감사합니다. 그 지금 일하고있어. 소년은 내 얼굴이 붉다 ... –

2

이 작업을 시도 할 수 있는지에 대한

@-moz-document url-prefix() { 
    ul.titles li { 
     padding: 7px; 
    } 
} 

당신의 CSS 어쩌면 당신의 li

1

, 나는 공통 요소는 일반적인 스타일로 시작하게 Normalize.css을 사용하는 것이 좋습니다. 내가 개발하는 모든 단일 웹 사이트에 있어야합니다.

관련 문제