I wonder if anyone here can help me... I am having troubles with the table code. It is messing with other elements on my page. Does anyone know how I can fix it so that it only adds a border to the sections I want to have borders and not to everywhere on the page?
Every time I add html code bits to my page to create these:
It makes the Header look like this:
When it is supposed to look like this:
*I use weebly as my website building platform, so the elements in the first picture above was created with the custom element tool. Each product block is a single cell table, and this is the code I am using for each product block (apart from a few URLs and Text, etc... each one is the same):
<!DOCTYPE html>
<html>
<head>
<style>
table, th, td {
border: 2px solid #DCDCDC;
padding: 1px;
}
table {
border-spacing: 1px;
}
th, td {
padding: 5px;
}
a {
text-decoration: none;
}
p.small {
line-height: 60%;
}
</style>
</head>
<body>
<table style="width:100%">
<tr>
<td><div align="center">
<a href="http://www.rebeckahstreasures.com/happily-ever-after-crochet-pattern-for-fashion-dolls.html"><img src="http://www.weebly.com/uploads/1/4/3/9/14399682/1012548_orig.jpg" alt=”Happily Ever After Fashion Doll Crochet Pattern PDF $10.00 by Rebeckah’s Treasures - You can be a designer too when you mix and match necklines & silhouettes! Grab your copy today here: http://goo.gl/5bXO46 #crochet #pattern #barbie #toys” border="0" width="100%" style="margin:3px 0px"/><h4 style="margin:0px 0px">"Happily Ever After"</h4><h5 style="margin:0px 0px">Crochet Pattern</h5></a>
<p class="small" style="margin:0px 0px"><em>
$10.00 USD</em></p>
<a href="#" onclick="R.cart.add(36645, 220124); return false;"><img src="http://www.weebly.com/uploads/1/4/3/9/14399682/_8947683_orig.png" border="0" width="120"style="margin:0px 0px"/></a></div></td>
</tr>
</table>
</body>
</html>
Thanks in advance!