Josh Pullen site design try

by Josh Pullen

HTML

<nav id="nav">
    <a href="#">Home</a>
    <a href="#">About Me</a>
    <a href="#">Blog</a>
</nav>
<div id="contentwrapper">
<div id="me">
    <div>Josh Pullen</div>
    I'm a <font>kid</font> who likes making <font>games</font>, designing <font>websites</font>, doing <font>math</font>, and <font>helping</font> others.
</div>

<div id="news">
    <div>
        <h2>Lorem Ipsum Dolor</h2>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus non tincidunt sem, luctus molestie velit. Vestibulum cursus nunc vel neque placerat vehicula. Ut eleifend velit nec arcu accumsan tempus. Duis nec consectetur urna. Interdum et malesuada fames ac ante ipsum primis in faucibus. Nulla gravida scelerisque risus at consectetur. Quisque id semper nunc, et malesuada ipsum. Sed gravida at libero ullamcorper tempor. Cras et adipiscing lectus. Aenean in porttitor ligula, id adipiscing tortor. Duis vestibulum dolor sed neque venenatis ultricies. Nunc semper tortor libero. Quisque non posuere dui.
    </div>
</div>

<div id="icons">
    <table>
        <tr>
            <td>
                <a href="#">
                <img src="https://photos-6.dropbox.com/t/0/AABAJv5lccdrd5azQU6EgKKEb6IgmawoFGdZZeTJ2BpJZg/12/79025865/png/32x32/3/_/1/2/gamecontroller.png/dSvs08wue2wieN0pQ7gTqfU-zbsxoMqb4Odulre39FE?_subject_uid=79025865&size=1024x768">
                <h2>Games</h2>
                </a>
                <div>Here's were I post all my games! You can spend hours digging though all the stuff I've made. Enjoy!</div>
            </td>
                <td><a href="#"><img src="https://photos-2.dropbox.com/t/0/AADhLQiYlByG5BIThqgxFNr80dSSA7h8C5hK7V6D10dp5w/12/79025865/png/32x32/3/_/1/2/document.png/WBoJCG14_8VQCRbts72YhTr85ldjixweM9s9HPyfrVo?_subject_uid=79025865&size=1024x768"><h2>Blog</h2></a><div>See what I'm up to at my blog. Not only do I rant about video game logic, I also give mini-tutorials and more!</div></td>
                    <td><a href="#"><img...

CSS

@import url(http://fonts.googleapis.com/css?family=Roboto:100,400);

body {
    margin:0px;
    margin-top:60px;
    font-family: 'Roboto';
}
#nav {
    width:100%;
    background:white;
    opacity:.98;
    position:fixed;
    top:0;
    height:40px;
    text-align:center;
    padding-top:20px;
    z-index:999;
}
#nav a {
    color:#444;
    text-decoration:none;
    padding-left:25px;
    padding-right:25px;
    transition:color .15s;
    font-size:1.1em;
}
#nav a:hover {
    color:#3E659C;
}
#me {
    background:#6C6;
    color:white;
    text-align:center;
    font-size:1.1em;
    padding-top:50px;
    padding-bottom:50px;
    padding-left:40px;
    padding-right:40px;
}
#me div {
    font-size:2.5em;
}
#me font {
    text-shadow:0px 0px 5px #047804;
}
#news {
    background-color:white;
    color:#444;
    padding-left:30px;
    padding-right:30px;
    padding-top:10px;
    padding-bottom:20px;
    font-family:'Times new roman';
    text-align:center;
}
#news div {
    width:calc(100% - 200px);
    display:inline-block;
    text-align:left;
}
#icons {
    background:#34495e;
    padding-top:20px;
}
#icons table {
    border:none;
    width:100%;
    min-width:500px;
    color:white;
    text-align:center;
}
#icons a {
    color:white;
    text-decoration:none;
}
#icons div {
    width:170px;
    display:inline-block;
    margin-bottom:20px;
}
#footer {
    width:100%;
    background:white;
    color:#444;
    text-align:center;
    padding-top:20px;
    padding-bottom:20px;
}
#footer a {
    color:#444;
    text-decoration:none;
    padding-right:10px;
    padding-left:10px;
}
#footer a:hover {
    text-decoration:underline;
    color:#3E659C;
}