Why can I not move an image up the page?

Think about the structure of your page, you have 2 columns, so code 2 columns.

Below is the 'content' section coded into 2 columns (shown in red):

<div class="content">

<h2 class="centered_text">Harpur Mews</h2>

<div class="content_col_1">

<img src="http://v33.ancestry.higgsy.co.uk/archive/map5a.jpg" alt="" width="720" height="955" class="fltlft_margin_RB"/>

<img src="http://v33.ancestry.higgsy.co.uk/archive/744_Policeman_in_Harpur_Mews_w380.jpg" width="380" height="651" alt=""/><br/>

<span class="archive_text">Archive:</span> 744

</div>

<!-- end content_col_1 -->

<div class="content_col_2">

<div><img src="http://v33.ancestry.higgsy.co.uk/archive/streets/755_Dombey St Harpur Mews 2013-06-27 15.29.55_w380.jpg" width="380" height="509" alt=""/><br/>

<p class="para_width"><span class="archive_text">Archive:</span>

755 Harpur Mews. This is on the south side of Dombey Street. The old pictures below show a street party in this mews to celebrate the king's anniversary in 1936</p></div>

<div class="fltlft_margin_RB"><img src="http://v33.ancestry.higgsy.co.uk/archive/streets/756_Dombey St Harpur Mews 2013-06-27 15.30.07_w380.jpg" width="380" height="509" alt=""/><br>

<span class="archive_text">Archive:</span> 756 A closer look...</div>

</div>

<!-- end content_col_2 -->

<div class="clear_float spacer">

<hr/>

</div>

<!-- end clear_float -->

</div>

<!-- end .content -->

Add the below css selectors to your css stylesheet:

.content_col_1 {

float: left;

width: 720px;

}

.content_col_2 {

float: left;

width: 380px;

margin-left: 25px;

}