I can't get this image to center within the div.
As you can see, I've tried a number of different things to get it centered, but it still hangs to the left margin.
<table align="center" cellpadding="3" id="headerTable">
<img src="Images/ContactMeHeadShot.png" border="0" alt="Rebecca's Headshot" align="center">
I've also tried this:
The style on the 'header' div looks like this:
<div Style="width:209px; margin-left:auto; margin-right:auto; margin-top:20px;">
<img src="Images/ContactMeHeadShot.png" border="0" alt="Rebecca's Headshot" >
The problem that I have in FF with the second method is that the addition of the 'margin-top:20px;' brought the outer 'header' div down 20px relative to its container instead of the inner unnamed div coming down 20px within the header div as it does in IE.
background: url(Images/FlowerPetals.png) #C0B68F no-repeat center;
What would you suggest with this? I would like to get the image centered left to right and down about 20px. The table method allowed me to move it down easily by adding a row above it while the div method allowed me to center it. Am I left to combine the two? I think there must be something I'm missing here.
Anyone feel like illuminating?