I know some readers have problems with centering elements.
If the images are same % width, you could try this workaround.
(Or if several different %'s you need several classes for the different %'s)
In the class instead of doing a text-align:center; change it to margin-left:#%; the # being (100-width%)/2 e.g. if width is 60% then it would be (100-60)/2=20 -> margin-left:20%;
If it works, you could create several classes to compensate for several % widths
Code:
pic10 {margin-left:45%}
pic20 {margin-left:40%}
pic30 {margin-left:35%}
pic40 {margin-left:30%}
pic50 {margin-left:25%}
pic60 {margin-left:20%}
pic70 {margin-left:15%}
pic80 {margin-left:10%}
pic90 {margin-left:5%}
pic100 {margin-left:0%}
Then use the correct selector for the element holding the picture.