<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
<style type="text/css">
<!--
#test_box {
display : block;
position : absolute;
top : 30px;
bottom : 30px;
left : 50px;
right : 100px;
border-style : solid;
border-color : blue;
border-width : 1px;
}
-->
</style>
</HEAD>
<BODY>
<div id="test_box">
</div>
</BODY>
</HTML>
제가 하고 싶은 것은 test_box 가 상하좌우에 일정한 여백을 가지면서 창크기를
조절하면 그에 맞게 크기가 조정되게 하는 것입니다.
파이어폭스 에서는 잘되는데 IE 에서는 안됩니다. bottom, right 대신에
height , width 를 설정하면 되긴하는데 이렇게하면 창크기를 조절해도 test_box
의 크기는 변하지 않습니다. IE 에서 되게 할 방법 없을까요???
top : 30px;
bottom : 30px;
left : 50px;
right : 100px;
뭐 원하시는 답은 아니지만 오른쪽과 아래쪽 여백이 꼭 픽셀 단위로 맞아야 하는 게 아니라면 그냥 아쉬운대로 위 방법 대신에 아래처럼 해주면 안될까요? 오른쪽과 아래쪽 offset에도 절대 단위를 쓰신다면 그곳에 크기가 정해진 그래픽이 있거나, 시각적으로 절대적인 공간을 확보하는게 예뻐보이거나 둘 중의 하나일 것 같은데.... 저처럼 텍스트 위주로 작업을 하는 사람들은 px을 거의 안 쓰기 때문에 아래처럼 그냥 합니다. 사실 top과 left도 px 대신에 em같은 걸로 해서 글자 크기가 변해도 글자가 몇 자 정도 들어갈 공간, 이런 식으로 놓구요.
top : 30px;
bottom : 30px;
left : 50px;
right : 100px;
뭐 원하시는 답은 아니지만 오른쪽과 아래쪽 여백이 꼭 픽셀 단위로 맞아야 하는 게 아니라면 그냥 아쉬운대로 위 방법 대신에 아래처럼 해주면 안될까요? 오른쪽과 아래쪽 offset에도 절대 단위를 쓰신다면 그곳에 크기가 정해진 그래픽이 있거나, 시각적으로 절대적인 공간을 확보하는게 예뻐보이거나 둘 중의 하나일 것 같은데.... 저처럼 텍스트 위주로 작업을 하는 사람들은 px을 거의 안 쓰기 때문에 아래처럼 그냥 합니다. 사실 top과 left도 px 대신에 em같은 걸로 해서 글자 크기가 변해도 글자가 몇 자 정도 들어갈 공간, 이런 식으로 놓구요.
사실은 저도 그렇게 해보려고 했는데요, 위에 제가 올려놓은 것은 좀 단순화 시켜 놓은 것이구요, 실제로는 test_box 같은 div 가 연속으로 여러개가 있고 각각에 조각그림을 배경으로 지정해서 전체적으로 봤을 때 완성된 배경 이미지가 창의 크기에 따라서 알맞게 조절되도록 하는 것이었습니다.
그런데 % 로 크기 조절이 될경우 창크기를 조절하다보면 각 조각 사이에 두께가 1px 정도되는 빈줄이 생기는 경우가 있더군요.(파폭에서 제가 원래 하려고 하던 방식으로 하면 그런 현상이 없습니다.)
여백이 생기나요..
음. 이건 웃기는 경우일꺼 같은데..
원래 내가 알기로 이건
position:absolute;top:30px;left:40px;
이렇게 하면 페이지를 기준으로 상단 30픽셀 지점, 왼쪽으로 40픽셀 지점에서
해당 객체가 표시되도록 하는 페이지 레이아웃 기능인데..
이게 여백으로 움직이나요..
