[해결]스타일시트의 background-repeat

[sylund]

http://www.w3.org/TR/CSS21/colors.html# ... properties 를 참조해보면

CSS 2.1 버전에서는 background-repeat 라는 것이 있습니다.

배경이미지를 x축으로만 반복할지 y축으로만 반복할지를 설정할수 있는듯 한데요.

파이어 폭스에서는 잘 동작하지않는거 같습니다.

예를 들자면 제 홈페이지 http://sylund.net 의 위쪽 메뉴를 보면

익스플로러에선

<img src="http://mimosa.snu.ac.kr/~sylund/bbs/dat ... and/ex.jpg">

이렇게 보이던 것이.

파이어 폭스에선

<img src="http://mimosa.snu.ac.kr/~sylund/bbs/dat ... irefox.jpg">

이렇게 보이는군요.

오페라도 제대로 적용이 안되는듯 합니다.
<img src="http://mimosa.snu.ac.kr/~sylund/temp/opera.jpg">

각 텝에 배경으로 들어가있는 이미지가
repeat-x (x축으로만 반복)하게 되어있는데 파이어 폭스에서는 제대로 처리해 주지 못한것 같습니다.

또하나 처리방법이 다른점은
내용이 하나도 없는 테이블의 셀은
이를테면 <td></td> 같은 부분은
표시해 주지 않더군요.

익스플로러는 전체 테이블에 의거해서 적당히 표시해주는 것 같네요.
그리고 오페라도 그렇게 표시해줍니다.
(위의 메뉴를 보시면 조금 차이가 나죠?)

둘다 쓰는 저로서는 조금 아쉬운 부분이랄까요?

[식자공]

테스트해봤는데 아주 잘작동합니다!!

[sylund]

앗 그렇습니까?
제것이 최신버전이 아니거나 스타일시트에 관련된 환경설정이 잘못되었을수도 있겠네요~
한번 찾아보겠습니다.

어쨌든 잘 작동된다니 굉장히 기쁜일은 틀림없군요.
(참고로 저는 모두 윈도우용을 사용했답니다.)

[지나다가...]

저역시 제대로 안보이는데...;;;

[kheled]

background-repeat: 'repeat-x';
가 아니고
background-repeat: repeat-x;
로 해보세요. repeat-x는 키워드이니까요.

비어있는 셀 <td></td> 부분은 저는 잘 동작하는데요. 정확한 소스를 올려보세요.

[sylund]

background-repeat: repeat-x; 로 바꾸니까 비어있는 셀 부분은 잘 동작합니다.
아마도 다른 뭔가의 이유가 있을것 같기도 하군요.

그런데 그렇게 바꾸고 나니 배경이 아예 표시되지 않는군요.
뭔가 알수가 없습니다...

우선 위의 메뉴만 빼낸 소스는 (원래는 php로 루프 돌려서 만드는거라..)
<a href=http://mimosa.snu.ac.kr/~sylund/test.html target=_blank>http://mimosa.snu.ac.kr/~sylund/test.html</a> 이구요.
<a href=http://mimosa.snu.ac.kr/~sylund/style.css target=_blank>http://mimosa.snu.ac.kr/~sylund/style.css</a> 가 스타일 시트 파일입니다.

한수 가르침을 부탁드립니다.

[sylund]

아무래도 뭔가 내부적으로 스타일시트가 꼬였을 가능성도 있는거 같군요...
background-repeat: repeat-x; 로 바꾸니까 게시판마다 약간씩 다르게 보이는군요
어떤곳에서는 아예 비어있고 어떤곳에서는 보이고. 흐음...

[박상현]

.menu_shadow의 background-attachment: fixed;를 지우면 해결이 되는 것 같기도 합니다.

아마 저기서 fixed는 '보이는 영역'에서 고정되어 있는 것을 뜻하는 것입니다. 즉 브라우저 창에서 스크롤을 해도 창 영역 자체는 움직이지 않지요. 익스플로러에서는 제대로 지원하지 않기 때문에 혼동을 일으키지 않나 합니다.

[sylund]

박상현님 빙고! 맞습니다.
버그입니다 버그!
제가 스타일 시트 쓸때 복사해서 붙여넣었던 것이 남아서 이런 요상한 현상을 보였나 봅니다.

.menu_shadow의 background-attachment: fixed;를 지우는 것이 논리상으로도 맞고, 제대로 잘 나옵니다!

에잇 익스 바보!
이것으로 모질라의 버그가 아니라는것이 밝혀졌습니다 =)

의도하던대로 "완벽하게" 나오는군요~
오페라는 아직 약간 덜컥거립니다만, 그건 오페라의 minor한 문제같군요.

답글 달아주신 모든분께 다시한번 감사의 말씀을 전합니다.

[sylund]

버그가 아니니까 그냥 질문게시판으로 옮였습니다^^