레이어 위치

국내에 웹 사이트들이 웹 표준을 지키고 OS나 브라우저와 관계 없이 접근성을 향상 시키기 위한 사이트 버그 신고 및 문제 해결을 위한 게시판입니다.
댓글 게시
astraea
해커
해커
게시물: 477
참여됨: 2004 01 04 23:57 23
연락:

레이어 위치

게시물 작성자 astraea » 2004 06 21 19:38 27

레이어 위치에서.
firefox 랑 i.e 랑 다르게 잡네요;;
어느게 정상인지도 모르겠어요ㅡ_ㅡ;;
물론 firefox 가 표준이긴 하겠지만..a

문제 되는건..
problem 이 나오는 레이어 부분이에요..

firefox 는 menu 레이어에 딱 들어가게 나오는데.
i.e 에서는 menu 레이어의 가운데에서부터 시작하네요;;

그렇다고 center 태그를 그 위까지만 적용하면.
firefox 는 아예 menu 레이어 밖으로 벗어나구요ㅡ_ㅡ;;

어케 해야하나요?;;;


<html>
<body>
<center>
<div id=div1 style="width:975px;height:500px;border:1px #bbb dotted">
<div id=main style="width:790px;height:80%;float:left;border:red 1px solid;">
main</div>
<div id=menu style="width:150px;height:80%;float:right;border:#d3e1cb 1px solid;">
menu
<div id=problem style="position:absolute;bottom:20px;color:#333333;border:blue 1px solid;width:200px">
problem</div>
</div>
</div>
</center>
</body>
</html>
----------
firefox nightly

astraea
해커
해커
게시물: 477
참여됨: 2004 01 04 23:57 23
연락:

Re: 레이어 위치

게시물 작성자 astraea » 2004 06 21 19:39 16

덧붙여서..이건 좀 상관없긴 하지만..
레이어 높이를 정하는 스크립트 아시면 알려주세요~a
----------
firefox nightly

위치값이문제

Re: 레이어 위치

게시물 작성자 위치값이문제 » 2004 06 26 20:27 44

<center>
<div id=div1 style="width:975px;height:500px;border:1px #bbb dotted">
<div id=main style="width:700px;height:80%;float:left;border:red 1px solid;">
main</div>
<div id=menu style="width:150px;height:80%;float:right;border:#d3e1cb 1px solid;">
menu
<div id=problem style="width:150px;bottom:20px;color:#333333;border:blue 1px solid;">
problem</div>
</div>
</div>
</center>

상대위치와 절대위치를 잘못지정해서 문제가 되는 것같내요.. 그리고 위치지정값을 지정하지 않을 경우 모두 상대위치로 처리되고 브라우저마다 nested div 태그 처리방식이 다른 것같내요.

그리고 스타일시트는 나중에 관리를 위해서 동일한 규칙순서를 가지면 좋은 것같습니다.

astraea

Re: 레이어 위치

게시물 작성자 astraea » 2004 06 26 22:37 36

problem 을 맨밑에 넣고 싶은데;
화면 끝부분에...

position만으로

Re: 레이어 위치

게시물 작성자 position만으로 » 2004 06 27 18:09 29

<html>
<body style=margin:0 0 0 0>
<div style=position:absolute;left:0px;top:0px;width:150px;height:80%;background:blue;>주메뉴1</div>
<div style=position:absolute;left:0px;top:80%;width:150px;height:20%;background:red;>광고1</div>
<div style=position:absolute;left:160px;top:0px;width:150px;height:80%;background:gray;>주메뉴1</div>
<div style=position:absolute;left:160px;top:80%;width:150px;height:20%;background:yellow;>광고2</div>
</body>
</html>

HTML 배우는 것도 그렇지만, CSS에도 여러 요소를 사용하기에 따라 다르기 때문에 이것저것 테스트해볼 수 밖에 없다는 생각입니다.

이것을 table로 짜는 것은 어쩌면 간단할 수도 있지만, 아주 간단하게 되는군요.. ^^

댓글 게시

누군가 접속

유저들이 이 포럼을 탐색중: 가입된 유저 없음 그리고 2 손님들