CSS won't move the images down on my screen. How do I fix this with HTML/CSS?

admin

Administrator
Staff member
<div class="snippet" data-lang="js" data-hide="false">
<div class="snippet-code">
<pre class="snippet-code-html lang-html prettyprint-override">
Code:
&lt;body&gt;
  &lt;div class="nav"&gt;
    &lt;div class="container"&gt;
      &lt;ul&gt;
        &lt;li&gt;&lt;a href="file:///C:/Documents%20and%20Settings/USER1/My%20Documents/Gary%20Nauman/index.html#"&gt;Home&lt;/a&gt;
        &lt;/li&gt;
        &lt;li&gt;&lt;a href="file:///C:/Documents%20and%20Settings/USER1/My%20Documents/Gary%20Nauman/browse.html"&gt;Browse&lt;/a&gt;
        &lt;/li&gt;

        &lt;li&gt;&lt;a href="#"&gt;About the Artist&lt;/a&gt;
        &lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Contact&lt;/a&gt;
        &lt;/li&gt;
        &lt;li&gt;&lt;a href="#"&gt;Help&lt;/a&gt;
        &lt;/li&gt;
        &lt;li&gt;
          &lt;a href="https://www.facebook.com/gary.nauman"&gt;
            &lt;img src="https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcTIxiKzqYh3OHT8LXw268axd6OfuFqgOqxNAr2kWqBL0xeRVfRFuw" alt="https://www.facebook.com/gary.nauman" width="42" height="42" border="0"&gt;
          &lt;/a&gt;
        &lt;/li&gt;
        &lt;li&gt;
          &lt;a href="https://garynauman.wordpress.com/"&gt;
            &lt;img src="http://cdn.mysitemyway.com/etc-mysitemyway/icons/legacy-previews/icons-256/black-ink-grunge-stamps-textures-icons-social-media-logos/097743-black-ink-grunge-stamp-textures-icon-social-media-logos-wordpress.png" alt="https://garynauman.wordpress.com/"
            width="42" height="42" border="0"&gt;
          &lt;/a&gt;
        &lt;/li&gt;
      &lt;/ul&gt;
    &lt;/div&gt;
  &lt;/div&gt;

  &lt;div id="art"&gt;

    &lt;img src="C:\Documents and Settings\USER1\My Documents\Downloads\gknproject\goodtidings.jpg" width="400" height="400" align="middle" class="image" style="padding-left:400px" style="padding-top:50px" /&gt;

    &lt;hr width="40%"&gt;
    &lt;img src="C:\Documents and Settings\USER1\My Documents\Downloads\gknproject\coffee.jpg" width="200" height="200" class="image" /&gt;

  &lt;/div&gt;
</div>
</div>


I need the images to not be right under the nav bar, I've been searching for about an hour and haven't found anything. How can I move the images down with CSS?