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,711
14년 전 조회 1,159
14년 전 조회 1,677
14년 전 조회 1,287
14년 전 조회 1,416
14년 전 조회 1,252
14년 전 조회 2,036
14년 전 조회 1,726
14년 전 조회 1,235
14년 전 조회 2,533
14년 전 조회 2,239
14년 전 조회 3,892
14년 전 조회 1,624
14년 전 조회 2,273
14년 전 조회 1,373
14년 전 조회 2,740
14년 전 조회 2,323
14년 전 조회 1,556
14년 전 조회 1,264
14년 전 조회 1,158
14년 전 조회 2,001
14년 전 조회 1,143
14년 전 조회 1,513
14년 전 조회 2,244
14년 전 조회 1,986
14년 전 조회 4,104
14년 전 조회 1,779
14년 전 조회 1,856
14년 전 조회 1,170
14년 전 조회 1,219
🐛 버그신고