Center the DIV content with nested display: block float Left

Question

I have a series of images that use a Spry fade effect as a slide show.
It works OK but the images are all jammed up into the top left corner
even when i put them in a table. I have attached the body code below.
Can anyone please help solve this poblem?
Thank you kindly.
<table width="800" border="0" align="center">
  <tr>
    <td> <div class="quote" style="position: relative; top: 0px; left: 0px; opacity: 0; display: none; visibility: visible;"> <img height="600" width="800" src="/uploads/images/_009a.jpg" alt="" /> </div>
<div class="quote" style="position: relative; top: 0px; left: 0px; opacity: 1; display: block; visibility: visible;"> <img height="600" width="800" src="/uploads/images/_010a.jpg" alt="" /></div>
<div class="quote" style="position: relative; top: 0px; left: 0px; opacity: 0; display: block; visibility: visible;"><span class="quote" style="position: relative; top: 0px; left: 0px; opacity: 0; display: block; visibility: visible;"><img height="600" width="800" src="/uploads/images/_047a.jpg" alt="" /></span></div>
<div class="quote" style="position: relative; top: 0px; left: 0px; opacity: 0; display: none; visibility: visible;"> <img height="600" width="800" src="/uploads/images/_056a.jpg" alt="" /></div></td>
  </tr>
</table>

Answer 1

Please refer to the link: http://www.adobe.com/devnet/dreamweaver/articles/first_website_pt3.html
Styling the images with captions
To keep the image and caption together and center them, you need to give the <figure> element a width. You'll also add a CSS drop shadow effect to the image to make it look more like a photograph.
Styling the <figure> and <figcaption> elements
The small images in the home page and sightseeing.html are all 400 pixels wide. To create the photo effect, you need to add another 20 pixels to the width of the <figure> element.
Make sure main.css is selected in the Sources pane, and create a new selector called figure.
In the Layout section, set width to 420px.
Create a selector for figcaption.
Before you can center the caption, you need to set its display property (in the Layout section) to block.
In the Text section, set the following properties:
font-weight: bold
font-size: 14px
text-align: center
Step 4 above is my problem. How can I set its display property (in the layout Section) to block?