absolute의 부모박스 높이설정 질문

<div id="wrap">
   <div id="header">
      <div id="header-title">
         <a href="/"><img src="/main/img/main_name.jpg" alt="크레이지폰"></a>
      </div>
      <div id="menuArea">
         <ul class="top-member-menu">
                 <li><p>1</p></li>
                <li><p>2</p></li>
               <li><p>3</p></li>
           </ul>
         <ul class="top-menu">
            <li><p>4</p></li>
         </ul>
      </div>
   </div>
</div>

#wrap {positin:relative; width:100%;}

#header {width:1200px; margin:auto; top:30px; background-color:#fff; z-index:100;}
#header-title {width:100%; text-align:center;}
#menuArea {position:absolute; right:150px;}
#menuArea .top-member-menu {font-size:12px; font-weight:bold;}
#menuArea .top-menu {font-size:12px; font-weight:bold;}

이 상태에서 부모가 absolute인 자식을 감싸게 하고 싶어서 찾아보니 부모에

#wrap:after {content:""; display:block; clear:both;}

이렇게 하면 absolute인 자식을 감싼다고 하는데 왜 안되는거죠??