2010-11-20 4 views
0

전체 레이아웃이 백분율을 기반으로하고 테두리가 너무 커서 px가 너무 커서 화면이 작을 때 한 부분이 더 아래로 뜨기 때문에 테두리를 백분율로 만들려고합니다.% s에서 CSS 테두리를 측정 할 수 있습니까?

jsFiddle 페카 및 SIME로 적어도 안정적으로 테두리 너비에 대한 here

+0

다음 코드는 http://goo.gl/AHvEH – chromedude

+0

다음 번에 질문에 넣어주세요! – Eric

+0

@ 에릭 (Eric), 내가 질문을 작성한 이후에 사람들이 그것을 알아 차리기를 원했기 때문에 나는 그것을 설명했다. – chromedude

답변

0

아니, 당신은 사용할 수 없습니다 비율은 지적한다.

예, 국경에 대해 백분율을 사용할 수는 있지만 매우 정통적이지 않은 문제는 아마도 레이아웃의 다른 곳에서 발생했을 것입니다. 을 % 값을 포함하는 블록은 수평 텍스트 모드가 있으면 블록을 포함하는 폭에 기초 http://www.w3.org/TR/css3-background/#border-width

그렇지 않으면 신장

+0

아니요, 작동하지 않습니다 – thejh

+0

@thejh 어떤 브라우저에서 사용하십니까? –

+0

@ ime Vidas : Chrome 9.0.587.0 dev을 사용해보세요. – thejh

1

예, 사양을 확인.

브라우저 호환성 : 존재하지 않습니다.
IE9 베타, FF4 베타 7, 오페라 10,63, 최신 Chrome 및 Safari와 같은 브라우저에서는 작동하지 않습니다. 내가 바로 사양을 읽으면

+0

사실,하지만 이것은 CSS3에서 새로운 것 같습니다. –

2

, 그것은 valid in CSS 3입니다 :

백분율 : 폭 * 블록을 포함하는의

이 될 것으로 보인다 CSS 1 2.1에서 무효 :

백분율 : N/A

따라서 모든 브라우저에서 지원되는 것은 아닙니다.

+0

질문은 백분율을 지원하는 브라우저와 그렇지 않은 브라우저 중 하나입니다. –

0

은 CSS3에는 유효하지만 CSS2에는 유효하지 않습니다.

CSS2의 박스 모델이 border widthlength 유형, 그리고 말한다

:

(이 규격에 <length>에 의해 을 표시) 길이 값의 형식 (또는 소수 점없이) <number>입니다

바로 뒤에 식별자 (예 : px, em 등)가옵니다. 길이가 0이면 단위 식별자는 (선택 사항)입니다.

또한 percentages은 동일한 것이 아니며 바로 다음 섹션에서 설명합니다.

이제 CSS3를 완벽하게 지원하는 브라우저는 거의 없습니다. 이 기능에 크게 의존하고 싶지 않을 수도 있습니다.

+0

édéric ** 모든 ** 현대의 브라우저는 CSS3을 어느 정도 지원합니다. –

+0

@ Šime, 나는 IE9가 나올 때마다 당신이 맞을 것이라고 생각한다;) –

+0

édéric IE8에서 구현 된 CSS3 기능 목록 : @ font-face (부분적으로), 간접적으로 인접한 (a ~ b) 선택기, 여러 속성 선택자 overflow-x 및 overflow-y (부분적으로), 줄 바꿈, 텍스트 맞춤, 글 쓰기 모드, 상자 크기 조정, 루비 위치, 루비 정렬, 루비 정렬, 오버행, SVG 색상 키워드, 투명 (값) (부분적으로). IE8은 CSS3를 지원합니다. –

관련 문제