image padding problem - CSS

Junior WebHelper Joined: 10 Aug 2002 Posts: 1

I'm trying to solve a discrepancy between Mozilla and IE. Using this code (available at http://buffoonery.org/2.0/joe.html ):

<html>
<head>
<style>
.imageviewbox {
margin-top: 10px;
margin-bottom: 10px;
margin-left: auto;
margin-right: auto;
text-align: center;
}
.imageviewbox img {
border: 1px dotted #842424;
padding: 10px;
background: #FFF;
}
</style>
</head>
<body bgcolor="#CCCCCC">
<div class="imageviewbox">
<img src="http://buffoonery.org/images/photolog/070502/6.jpg">
</div>
</body>
</html>

IE for PC does NOT draw a padding around the image. Mozilla DOES. How can I get IE to draw a padding around it? This code will be used with some PHP that sticks different size images into the box, so I can't set static widths and such. Any help would be appreciated.

Posted: Sat Aug 10, 2002 9:49 pm (21 years, 8 months ago)

try:

Code:

<html>
<head>
<style>
IMG.imageviewbox {
margin-top: 10px;
margin-bottom: 10px;
margin-left: auto;
margin-right: auto;
text-align: center;
border: 1px dotted #842424;
padding: 10px;
background: #FFF;
}
</style>
</head>
<body bgcolor="#CCCCCC">
<img class="imageviewbox" src="http://buffoonery.org/images/photolog/070502/6.jpg">
</body>
</html>