D

css에서 이런 현상이 버그인지 아닌지 아시는분~

익스플로러도아니고 크롬에서...

 div에 border가 있고없고에 따라 위치가 달라져버리네요......

소스는 이러합니다.

<!doctype html>

<div style="position:relative; margin:0 auto; padding:0 190px 0 70px; width:490px; min-height:500px; _height:500px; font-size:9pt; border:0px solid red">
    
    <div style="position:relative; margin:130px 0 20px 0; min-height:100px; _height:100px; ">
    </div>
</div>

이러한 소스인데
빨간색표시한부분 border갑이 0이면 자식 div에 잇는 margin 값이 부모 div에도 적용되더라구요.
하지만 border:1px 을 주면 원하던대로됩니다..
 하아 짜증이 밀려오는군요..
버그 맞죠? 이런경우가 전에도 가끔 있었는데 그땐 그냥 넘어갈만한 상황들이었는데 
이번에는 이게 발목을 잡는상황이네요..
 일단은 1px 로 주고 #fff 줘서 없는 척 해줬지만 ㅡㅡ;; 해결책 아시는분 계신가요 ㅠ

|

댓글 5개

포지션을 사용할땐 margin 보다는 left:0; right: 0; top: 0; bottom:0; 을 사용하는게 좋습니다
아 그렇군요..
근데 top 으로 위치값을 주니까
그 이후에오는 div 들은 자동적응로 그 높이에맞춰서 배치되지않네요...

마치 absolute 준것처럼 위엣놈을 덮어씌우고있네요;
이러면 더 불편하지않나요?
overflow:hidden;
버그 아닌듯 한데요.....
<div style="position:relative; margin:0 auto; padding:0 190px 0 70px; width:490px; min-height:500px; _height:500px; font-size:9pt; border:0px solid red">
<div style="float:left; width:490px;">
<div style="position:relative; margin:130px 0 20px 0; min-height:100px; _height:100px; "> 1 </div>
<div style="position:relative; margin:0 0 20px 0; min-height:100px; _height:100px; "> 2 </div>
<div style="position:relative; margin:0 0 20px 0; min-height:100px; _height:100px; "> 3 </div>
</div>

</div>

이런식으로 div 하나 더만들어서 묶어주니깐.. 원하는대로 되긴하는데.
하 정말 css 참 많이 안다생각했는데도 여전히 의문점투성이네요.
댓글을 작성하시려면 로그인이 필요합니다.

자유게시판

+
제목 글쓴이 날짜 조회
14년 전 조회 1,725
14년 전 조회 1,178
14년 전 조회 1,692
14년 전 조회 1,303
14년 전 조회 1,428
14년 전 조회 1,266
14년 전 조회 2,051
14년 전 조회 1,737
14년 전 조회 1,249
14년 전 조회 2,547
14년 전 조회 2,249
14년 전 조회 3,904
14년 전 조회 1,639
14년 전 조회 2,292
14년 전 조회 1,388
14년 전 조회 2,755
14년 전 조회 2,335
14년 전 조회 1,571
14년 전 조회 1,280
14년 전 조회 1,171
14년 전 조회 2,016
14년 전 조회 1,158
14년 전 조회 1,526
14년 전 조회 2,256
14년 전 조회 1,998
14년 전 조회 4,118
14년 전 조회 1,791
14년 전 조회 1,868
14년 전 조회 1,187
14년 전 조회 1,229