말풍선 만들때 유용한 가상선택자

++++++++++++++++++++CSS3++++++++++++++++++++

.replyWrap{display:inline-block; width:720px;}

.replyInside{display:inline-block; position:relative; float:right; width:500px; background-color:#fbfbfb; border:1px solid #e7e7e7; padding:5px;}

.replyInside:before {

    content: "";

    position: absolute;

    top: 0px;

    left: -9px;

    width: 10px;

    height: 25px;

    background: url(../images/ico_bubble_arrow_gray.jpg) 0 0 no-repeat;

}

/*가상선택자:실제로 있진않지만 임의로 영역을 만들어버림. 말풍선 만들때 아주 유용함.*/

++++++++++++++++++++html++++++++++++++++++++

<div class="replyWrap">

<div class="replyInside">

<span style="font-weight:bold; display:block; margin-bottom:10px;">성낙* ( 2016-09-20 13:50:27 )</span>

댓글의댓글<br/>댓글의댓글<br/>댓글의댓글<br/>댓글의댓글<br/>댓글의댓글<br/>댓글의댓글<br/>댓글의댓글<br/>

</div>

</div>