Add space between image and table without br tag

[sirdanfortesque]

Hello folks, sorry for the remedial question but I have an image that is aligned to the left and I want my table to sit centered below the image. I have tried to increase the padding and margin spacing, but the only method that seems to work are < b r > tags, which feels unprofessional.

Thanks for any help!

[khorinshizucor]

Can you post your code?

[sirdanfortesque]

The just of the code is

<img href="someimage.jpg" align="left">
<p> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec et dolor vel dui bibendum consectetur id sit amet nisi. Cras.
</p>
<br>
<br>
<div align="center">
<center>
<table
<div align="center">
<center>
<table border="0" cellpadding="10" cellspacing="0">
<tr>
<td>some type</td>
</tr>

</table>
</center>
</div>

[khorinshizucor]

The just of the code is

<img href="someimage.jpg" align="left">
<p> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec et dolor vel dui bibendum consectetur id sit amet nisi. Cras.
</p>
<br>
<br>
<div align="center">
<center>
<table
<div align="center">
<center>
<table border="0" cellpadding="10" cellspacing="0">
<tr>
<td>some type</td>
</tr>

</table>
</center>
</div>

To center a table, use CSS:

table { margin:auto; }

Also, your code had a lot of unnecessary tags. This is all you need:

<table border="0" cellpadding="10" cellspacing="0"> 
<tr> 
<td>some type</td> 
</tr> 

</table>

You can see my example here.

[sirdanfortesque]

Oops, I accidentally pasted the script twice and I wasn't clear about what I am trying to achieve.


http://dshanson.com/test This is a better example of what I am trying to achieve, but without using the < b r > tag to create the spacing. I want the image aligned left to allow the text to wrap around the image. After that small change, the table wants to cram itself between the image and the containing div such as this example http://dshanson.com/test2

[khorinshizucor]

Ahh I see!

Okay, here's what I did. I created CSS class .alignleft and floated it left and added that to the image tag. Then, I add "clear:both;" to the table selector.

.alignleft { float:left; }
table { margin:auto; clear:both; }

<img src="http://images.shizucor.com/mermaid-site-wip.jpg" class="alignleft" />

[sirdanfortesque]

Awesome. Thanks for the help!

[khorinshizucor]

You're welcome! Glad I could help.