Trouble centering an image

Forum Moderators: not2easy

Message Too Old, No Replies

Trouble centering an image

Looked at old posting but the code didn't work for me?

donknotts

6:31 pm on Apr 14, 2007 (gmt 0)

In an old posting it said to add the img.center in the style which I did but it didn't center the image? Here is my code I'm obviously missing something.

<?xml version="1.0"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"/>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Travel</title>
<style type="text/css">

</style>
</head>
<body>
<div>
<h1>Travel</h1>
<hr />
</div>
<h2>This Page is Currently Under Construction</h2>
<img class="center" src="construction.gif" height="200" width="300" alt="under construction" />
</body>
</html>

DanA

8:25 pm on Apr 14, 2007 (gmt 0)

For IE 6, you have to remove the xml prologue.

Dabrowski

8:03 pm on Apr 15, 2007 (gmt 0)

The thing that springs to mind is that there's no centering style on your image.

Try changing to:

img.center{display:block; margin-left:auto; margin-right:auto; text-align: center;}

Alternatively, as the entire page is centered, just add:

BODY { text-align: center; }

then you can remove it everywhere else.