CSS, div 태그 안에 div 내용을 넣을 수 없습니다.

안녕하세요 div 태그에 관한 질문이 있습니다. 나는이 튜토리얼을 따라 갔는데, 나는 정확히 그가 한 것과 정확히 다른 결과를 얻었다. 나는 이것에 대해 봤고 대답을 찾을 수 없습니다.CSS, div 태그 안에 div 내용을 넣을 수 없습니다.

문제는 content_wrapper div 내의 내 div 태그가 content_wrapper div 내에 위치하지 않는다는 점입니다. 특히 튜토리얼에서와 동일한 작업을 수행 했음에도 불구하고 말입니다. 대신 div 태그는 content_wrapper div의 맨 아래에 위치합니다. 어떤 도움이 있다면 현재 Dreamweaver CS5를 사용하고 있습니다.

이

내가 내 div의 작성 방법이었다

<body> 

    <div id="header"> This is my header </div> 

    <div id="content_wrap"> 

     <div id="left_content"> Advertisement </div> 

     <div id="right_content"> </div> 

    </div> 

</body>

를이 내 CSS입니다 :

#header{ 
    height:1000px; 
    width:1000px; 
    margin-left:auto; 
    margin-right:auto; 
    border:solid 1px; 
} 

#content_wrapper{ 
    height:800px; 
    width:980px; 
    margin-left:auto; 
    margin-right:auto; 
    margin-top:10px; 
    } 

#left_content { 
    height:800px; 
    width:240px; 
    float:left; 
    margin-left:auto; 
    margin-right:auto; 
    border:solid 1px; 

} 

#right_content { 
    height:800px; 
    width:730px; 
    margin-left:10px; 
    margin-right:auto; 
    float:right; 
    border:solid 1px; 
    }

출처

2013-02-08 user2055955

'content_wrap'는! =' – Barmar

이 당신의 CSS의 너비, 높이, 여백, 패딩을 확인 content_wrapper'. – j08691

왼쪽과 상위 DIV (래퍼)을 삭제하지 않았기 때문에 잘 된 div가 붕괴된다. 당신의 <div id="content_wrap" class="clearfix">

.clearfix:after{ 
    clear: both; 
    content: "."; 
    display: block; 
    height: 0; 
    visibility: hidden; 
    font-size: 0; 
}

출처

2013-02-08 22:24:08 ashley

DIV ID가 "content_wrap"에 클래스를 추가 CSS 참조 "content_wrapper"

출처

2013-02-08 22:24:57

이것은 사실이지만 문제의 해답이 아닙니다. 그게 내가 대답이 아닌 논평으로 게시 한 이유입니다. – Barmar

나는 당신의 질문에 코멘트에 언급 된 ID 불일치 외에도 몇 가지 문제를 참조 일치하지 않습니다.

먼저 오른쪽 플로팅 요소가 먼저 와야합니다. 그런 다음, 떠 다니는 요소는 패딩과 여백을 포함하여 래퍼 요소의 너비보다 작은 너비를 가져야하거나 새 행으로 래핑해야합니다.

마지막으로 float 요소에 자동 여백을 사용하지 않으려 고합니다. 나는 네가 뭘했는지 확신 할 수 없기 때문에 확신 할 수 없다.

http://jsfiddle.net/z8Gwg/

#header { 
    height:100px; 
    width:100px; 
    margin-left:auto; 
    margin-right:auto; 
    border:solid 1px; 
} 
#content_wrapper { 
    height:80px; 
    width:98px; 
    margin-left:auto; 
    margin-right:auto; 
    margin-top:10px; 
    background-color: #eee; 
} 
#left_content { 
    height:80px; 
    width:20px; 
    float:left; 
    border:solid 1px; 
    overflow: hidden; 
} 
#right_content { 
    height:80px; 
    width:70px; 
    float:right; 
    border:solid 1px; 
} 

<body> 
    <div id="header">This is my header</div> 
    <div id="content_wrapper"> 
     <div id="right_content"></div> 
     <div id="left_content">Advertisement</div> 
    </div> 
</body>

출처

2013-02-08 22:29:58 isherwood

오른쪽으로 떠있는 요소는 먼저 올 필요가 없습니다. CSS가 떠 다니는 요소가 명확하지 않은 한. –

네 말이 맞아, 마이크. 감사. 나는 float가 다른 내용보다 먼저 올 필요가있는 single-float 시나리오를 생각하고있었습니다. – isherwood

CSS, div 태그 안에 div 내용을 넣을 수 없습니다.

답변

관련 문제