layout3 레이아웃3

<style>
 #ff{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    width: 100%;
    justify-content: center;
 }
</style>
<div id="ff">
    <div class="card"><img src="img/layout3_img1.jpg" /></div>
    <div class="card"><img src="img/layout3_img2.jpg" /></div>
    <div class="card"><img src="img/layout3_img3.jpg" /></div>
    <div class="card"><img src="img/layout3_img4.jpg" /></div>
    <div class="card"><img src="img/layout3_img5.jpg" /></div>
    <div class="card"><img src="img/layout3_img6.jpg" /></div>
    <div class="card"><img src="img/layout3_img7.jpg" /></div>
    <div class="card"><img src="img/layout3_img8.jpg" /></div>
    <div class="card"><img src="img/layout3_img9.jpg" /></div>
    <div class="card"><img src="img/layout3_img10.jpg" /></div>
</div>

<style type="text/css">
	#wrap div, #wrap ul, #wrap li, #wrap dl, #wrap dt, #wrap dd{
		border: solid 1px #000000;
		margin: 0px;
		margin-left: 5px;
	}
</style>
<div id="wrap">
	<div id="header">
		<h1>Gridly</h1>
		<ul>
			<li>home</li>
			<li>digital designs</li>
			<li>web designs</li>
			<li>branding/identity</li>
			<li>about me</li>
			<li>contact</li>
		</ul>
	</div>
	<div id="content">
		<!-- *********************Card Start********************* -->
		<div class="flat_card">
			<div class="card_top">
				<img src="/kaywon/sub/img/layout_jpg/layout3_img1.jpg" />
				<div class="img_script">Photoshop Design</div>
			</div>
			<div class="card_bottom">
				<dl>
					<dt>Dulux Colour Awards</dt>
					<dd>12th October 2011</dd>
				</dl>
				<div class="v_line"></div>
				<p>
					A direct mail kit that announces the Dulux Colour Awards Competition has commenced. A collection of posters showing the famous colours of history, advertises you add your own colours to history.
				</p>
				<div class="v_line"></div>
				<div>Read On →</div>
			</div>
		</div>
		<!-- *********************Card End********************* -->
	</div>
	<div id="footer">
		<div class="v_line"></div>
		<img class="icon" src="/kaywon/sub/img/layout_jpg/layout3_icon1.png" />
		<img class="icon" src="/kaywon/sub/img/layout_jpg/layout3_icon2.png" />
		<img class="icon" src="/kaywon/sub/img/layout_jpg/layout3_icon3.png" />
		<img class="icon" src="/kaywon/sub/img/layout_jpg/layout3_icon4.png" />
		<div class="v_line"></div>
		<div>This website &amp; the  Internet Ends hereg</div>
		<div>Copyright 2011 Showcase Design  www.BlazRobar.com</div>
	</div>
</div>