mhav · February 2, 2016 22:43
diff --git a/about.html b/about.html
 <!DOCTYPE html>
 <html lang="en">
 <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>About me</title>

    <link rel="stylesheet" href="css/normalize.css">
    <link rel="stylesheet" href="css/about_styles.css">

    <!--[if lt IE 9]>
        <script src="dist/html5shiv.js"></script>
    <![endif]-->
 </head>
 <body>
    <div class="container">
        <div class="header">
            <h1>About me</h1>
        </div><!-- end header -->
        <div class="image column">
            <img class="profile" src="img/lion_small.jpg" alt="kitten">
        </div><!-- end image -->
        <div class="intro column">
            <h2>Introduction</h2>
            <p>Everyday carry placeat biodiesel skateboard hoodie. Selvage nesciunt twee, intelligentsia hella vegan mlkshk tote bag. Meh leggings jean shorts intelligentsia, small batch nostrud cupidatat helvetica id. VHS lo-fi iPhone, helvetica occaecat williamsburg fap sapiente. Sed DIY ea pickled, banjo celiac pariatur cliche chartreuse ullamco retro fashion axe master cleanse flannel. Hammock distillery odio, tempor gochujang four loko art party knausgaard dolor ethical meditation schlitz XOXO letterpress. Cardigan chicharrones iPhone forage narwhal.</p>
        </div><!-- end intro -->
        <div class="skills column">
            <h2>My Skills</h2>
            <ul id="skill-list">
                <li>XOXO</li>
                <li>Lorem</li>
                <li>Ipsum</li>
            </ul>
        </div><!-- end skills -->
        <div class="main-text">
            <h3>More about me</h3>
            <p>Suspendisse vel nunc quam. Nunc tempus lectus tortor, ullamcorper ornare purus varius vitae. Nam lorem lorem, viverra sagittis volutpat eu, commodo ac tellus. In imperdiet, sem in rhoncus posuere, ex metus vestibulum quam, hendrerit fermentum ligula dolor vitae sapien. Aliquam id sapien ut tellus posuere porttitor. Phasellus consequat congue enim, in congue lorem dignissim non. Nulla facilisi. Morbi magna metus, faucibus ac ultrices a, eleifend a nibh. Donec in dapibus nisi. Donec aliquet a lacus non porttitor. Pellentesque convallis augue et odio tempus pulvinar. Integer non iaculis ipsum. Suspendisse vulputate eget ex posuere posuere. Aenean laoreet euismod aliquet.</p>
        </div>
    </div><!-- end container -->
 </body>
 </html>
diff --git a/about_styles.css b/about_styles.css
 * { 
  box-sizing: border-box; 
 }

 .container {
    width: 80%;
    margin: 0 auto;
 }

 .header h1 {
    text-align: center;
 }

 .header {
    padding: 50px;
 }

 .image {
    display: inline-block;
    ;float: left;
 }

 .column {
    display: inline-block;
    float: left;
    width: 30%;
    padding: 0 20px;
 }

 .main-text {
    clear: both;
    padding-top: 60px;
 }

 .profile {
    width: 100%;
 }
	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<title>About me</title>

	<link rel="stylesheet" href="css/normalize.css">
	<link rel="stylesheet" href="css/about_styles.css">

	<!--[if lt IE 9]>
	<script src="dist/html5shiv.js"></script>
	<![endif]-->
	</head>
	<body>
	<div class="container">
	<div class="header">
	<h1>About me</h1>
	</div><!-- end header -->
	<div class="image column">
	<img class="profile" src="img/lion_small.jpg" alt="kitten">
	</div><!-- end image -->
	<div class="intro column">
	<h2>Introduction</h2>
	<p>Everyday carry placeat biodiesel skateboard hoodie. Selvage nesciunt twee, intelligentsia hella vegan mlkshk tote bag. Meh leggings jean shorts intelligentsia, small batch nostrud cupidatat helvetica id. VHS lo-fi iPhone, helvetica occaecat williamsburg fap sapiente. Sed DIY ea pickled, banjo celiac pariatur cliche chartreuse ullamco retro fashion axe master cleanse flannel. Hammock distillery odio, tempor gochujang four loko art party knausgaard dolor ethical meditation schlitz XOXO letterpress. Cardigan chicharrones iPhone forage narwhal.</p>
	</div><!-- end intro -->
	<div class="skills column">
	<h2>My Skills</h2>
	<ul id="skill-list">
	<li>XOXO</li>
	<li>Lorem</li>
	<li>Ipsum</li>
	</ul>
	</div><!-- end skills -->
	<div class="main-text">
	<h3>More about me</h3>
	<p>Suspendisse vel nunc quam. Nunc tempus lectus tortor, ullamcorper ornare purus varius vitae. Nam lorem lorem, viverra sagittis volutpat eu, commodo ac tellus. In imperdiet, sem in rhoncus posuere, ex metus vestibulum quam, hendrerit fermentum ligula dolor vitae sapien. Aliquam id sapien ut tellus posuere porttitor. Phasellus consequat congue enim, in congue lorem dignissim non. Nulla facilisi. Morbi magna metus, faucibus ac ultrices a, eleifend a nibh. Donec in dapibus nisi. Donec aliquet a lacus non porttitor. Pellentesque convallis augue et odio tempus pulvinar. Integer non iaculis ipsum. Suspendisse vulputate eget ex posuere posuere. Aenean laoreet euismod aliquet.</p>
	</div>
	</div><!-- end container -->
	</body>
	</html>
	* {
	box-sizing: border-box;
	}

	.container {
	width: 80%;
	margin: 0 auto;
	}

	.header h1 {
	text-align: center;
	}

	.header {
	padding: 50px;
	}

	.image {
	display: inline-block;
	;float: left;
	}

	.column {
	display: inline-block;
	float: left;
	width: 30%;
	padding: 0 20px;
	}

	.main-text {
	clear: both;
	padding-top: 60px;
	}

	.profile {
	width: 100%;
	}