[HTML] 두개의 영역을 나란히 놓기

1.  위 아래로 배치하기

<div style="width:100%; height:100px; border:1px solid red;">

안녕하세요
</div>
<div style="width:100%; height:100px; border:1px solid green;">

안녕히가세요
</div>

안녕하세요

안녕히가세요

 

 

2. 나란히 붙이기

<div style="width:200px; height:150px; border:1px solid red; float:left; margin-right:10px;">
<p>안녕하세요</p>
</div>
<div style="width:200px; height:150px; border:1px solid green; float:left;">
<p>안녕히가세요</p>
</div><div style="clear:both;"></div>

안녕하세요

안녕히가세요

 

 

3. 양 사이드로 붙이기

<div style="width:200px; height:150px; border:1px solid red; float: left;">
<p>안녕하세요</p>
</div>
<div style="width:200px; height:150px; border:1px solid green; float: right;">
<p>안녕히가세요</p>
</div><div style="clear:both:"></div>

안녕하세요

안녕히가세요