I want to push the logo.png so it is about a third of the way across the page. When I create a large padding or margin, the image gets larger despite the other code limiting the image size.
<tr><td><img src="Logo.png" class="class"></td></tr>
The problem is the following: With
margin-left on the
img tag which is inside of the
td you change the width of the
td to the value of
margin-left (it just adapts the size of it's children). To keep proportions the image scales up.
Since table cells does not respect
width and will be collapsed based on the
width of the entire
table, you have to specify the
table to set a limitation of
width or maybe switch to
<div> elements where you have full flexibility.
height does not limit the width/height of your
table, because – as I said – it's adapt it's children widths / heights. So the inner element (the table) is bigger, so it overflows his parent.