박스형태의 이미지들 가로진열

박스형태의 각각의 이미지들을 첨부한이미지와 같은 형태로 진열하고 싶습니다.

가로 진열은 display:inline;으로 하면 될꺼라고 생각했는데 CSS초보라...

진열이 뒤죽박죽 되네요

그리고 이미지를

<DIV><IMG--------></DIV>

와

<IMG----------->

둘중에 어떻게 해야 되는지 알고 싶습니다^^ 

제가 작성한 HTML파일입니다.

<!DOCTYPE html>
</html>
<head>
 <title></title>
<style type="text/css">
 
#1 {
 display:inline;
}

</style>

</head>

<body>

<div id="1"><img src="http://www.jungdo03032.cafe24.com/SkinImg/2/1.jpg"/></div>
<div id="1"><img src="http://www.jungdo03032.cafe24.com/SkinImg/2/2.jpg"/></div>
<div id="1"><img src="http://www.jungdo03032.cafe24.com/SkinImg/2/3.jpg"/></div>
<div id="1"><img src="http://www.jungdo03032.cafe24.com/SkinImg/2/4.jpg"/></div>
<div id="1"><img src="http://www.jungdo03032.cafe24.com/SkinImg/2/5.jpg"/></div>

</body>
</html>​