HTML - Slight Problem - Positioning

#content {
margin: 0 0 0 180px;
overflow: auto;
background: #00f;
}
#main-image-container {
width: 690px;
margin: 0 auto;
    position: relative;
/*margin:0 auto 0 10%;*/
    text-align: center;
background: #fc6;
}
#main-image-container {
    position: relative;
	float:left;
/*margin:0 auto 0 10%;*/

    text-align: center;
margin-left:10%;
/*background: #00f;*/
}

#main-image-container #sliding-frame p {
    position: relative;
    height: 470px;
    overflow: hidden;
}

#main-image {
    /*position: absolute;*/
    cursor: nw-resize;
    z-index: 10;
    background-color: #111;
}

<div id="content">
  <div id="main-image-container"  {if $theme.imageCount == 0}style="display:none"{/if}>
    {if $theme.imageCount > 0}
      <div id="slideshow-controls">
        <ul id="control-buttons">
    <li><button id="controls-left">
      <img src="{g->theme url="images/controls-left.png"}" alt="{g->text text="Left"}" />
      </button></li>
    <li><button id="controls-play">
      <img src="{g->theme url="images/controls-right.png"}" alt="{g->text text="Play"}" />
      </button></li>
    <li><button id="controls-right">
      <img src="{g->theme url="images/controls-right.png"}" alt="{g->text text="Right"}" />
      </button></li>
        </ul>
      </div>

    <div id="sliding-frame">
      <div id="loading">
    {g->text text="Loading Album..."}
      </div>

      <p><img src="{g->theme url="images/blank.png"}"
      alt="{g->text text="Main image placeholder"}" id="main-image" /></p>
    </div>
    {/if}
	<div style="height:100px;clear:both;"></div>
    {assign var="childrenInColumnCount" value=0}
    {assign var="subalbumCount" value=0}
    <div id="thumbs-container"{if $theme.imageCount < 1 } style="background:none; margin-top:30px"{/if}>
  
	<div id="gsThumbMatrix" align="left">
    <ul style="list-style:none;"><li style="float:left;">
	 <table align="left">
    <tr valign="top">
    {foreach from=$theme.children item=child}

      {if !$child.canContainChildren && $child.entityType != 'GalleryLinkItem'}
        {if ($childrenInColumnCount == $theme.params.columns)}
          {* Move to a new row *}
          </tr></table></li><li style="float:left;"><table align="left"><tr valign="top">
          {assign var="childrenInColumnCount" value=0}
        {/if}
        {assign var=childrenInColumnCount value="`$childrenInColumnCount+1`"}
	{assign var=childSummary value=$child.summary|markup|escape:html}
	{assign var=childDescription value=$child.description|markup|escape:html}
        <td class="giItemCell">
          {if isset($theme.params.itemFrame) && isset($child.thumbnail)}
        {g->container type="imageframe.ImageFrame" frame=$theme.params.itemFrame}
          <a href="{g->url params=$theme.pageUrl arg1="itemId=`$child.id`"}">{g->image
            id="%ID%" item=$child image=$child.thumbnail
            class="%CLASS% giThumbnail size:=`$child.size`= summary:=`$childSummary`= description:=`$childDescription`="}</a>
        {/g->container}
          {elseif isset($child.thumbnail)}
        <a href="{g->url params=$theme.pageUrl arg1="itemId=`$child.id`"}">{g->image
            item=$child image=$child.thumbnail
            class="r giThumbnail size:=`$child.size`= summary:=`$childSummary`= description:=`$childDescription`="}</a>
          {else}
        <a href="{g->url params=$theme.pageUrl arg1="itemId=`$child.id`"}"
           class="giMissingThumbnail">
          {g->text text="no thumbnail"}
        </a>
          {/if}
        </td>
      {else}
        {assign var=subalbumCount value="`$subalbumCount+1`"}
      {/if}
    {/foreach}

    {* flush the rest of the row with empty cells *}
    {section name="flush" start=$childrenInColumnCount loop=$theme.params.columns}
      <td width="70">&nbsp;</td>
    {/section}
    </tr>
      </table></li>
	</ul>
	</div>

    </div>
  </div>

  {* Loop around for the albums this time *}
  {assign var="childrenInColumnCount" value=0}
  {if $subalbumCount > 0}
    <div id="subalbums-container">

    <table id="gsSubAlbumMatrix">
      <tr valign="top">
      {foreach from=$theme.children item=child}

    {if $child.canContainChildren || $child.entityType == 'GalleryLinkItem'}
      {if ($childrenInColumnCount == 2)}
        {* Move to a new row *}
        </tr><tr>
        {assign var="childrenInColumnCount" value=0}
      {/if}
      {assign var=childrenInColumnCount value="`$childrenInColumnCount+1`"}
      <td class="giAlbumCell gcBackground1">
        {if isset($child.thumbnail)}
          <a href="{g->url arg1="view=core.ShowItem" arg2="itemId=`$child.id`"}" style="clear:both;">
        {g->image item=$child image=$child.thumbnail}<br />
        {$child.title|entitytruncate:25}</a>
        {else}
          <a href="{g->url arg1="view=core.ShowItem" arg2="itemId=`$child.id`"}"
         class="giMissingThumbnail">
        <img src="{g->theme url="images/missing.png"}" width="40" height="40"
             alt="{g->text text="no thumbnail"}" /><br />
        {$child.title|entitytruncate:25}</a>
        {/if}

        {g->block type="core.ItemInfo" item=$child
          showDate=false
          showOwner=$theme.params.showAlbumOwner
          showSize=false
          showViewCount=false
          showSummaries=true
          class="giInfo"}
      </td>
    {/if}
      {/foreach}

      {* flush the rest of the row with empty cells *}
      {section name="flush" start=$childrenInColumnCount loop=2}
    <td>&nbsp;</td>
      {/section}
      </tr>
    </table>
  </div>
  {/if}
{/if}

{if !empty($theme.navigator)}
  <div class="gbBlock gcBackground2 gbNavigator">
    {g->block type="core.Navigator" navigator=$theme.navigator}
  </div>
{/if}

{* Store these results in a JavaScript-accessible set of arrays so the slideshow can get at them *}
<script type="text/javascript">
  // <![CDATA[
  var slideshowImageWidths = new Array({if $theme.imageCount==1}1);
  slideshowImageWidths[0] = {$theme.imageWidths};
  {else}{$theme.imageWidths});{/if}
  var slideshowImages = new Array();
  {foreach from=$theme.children key=i item=it}
    {if !$it.canContainChildren && $it.entityType != 'GalleryLinkItem'}
    slideshowImages.push('{if isset($it.image)}{g->url arg1="view=core.DownloadItem"
      arg2="itemId=`$it.image.id`" arg3="serialNumber=`$it.image.serialNumber`"
      htmlEntities=false}{else}{g->url params=$theme.pageUrl arg1="itemId=`$it.id`"
      htmlEntities=false}{/if}');
    {/if}
  {/foreach}
  // ]]>
</script>
<!--end content--></div>

<img src="myimage.jpg" width="150" height="113" style="opacity:0.0;filter:alpha(opacity=0);position:relative"><img src="myimg2.jpg" style="position:absolute;top:150px;left:150px" />