Centring An Image With HTML

Do you mean like the Center command?

<Center>

<embed src="Pic.gif"</embed>

</Center>

*edit: There fixed it

Hi Alan,
Could you set the image as a background image.
body{background:url(imag.gif) center center no-repeat;}

Nix I have no idea what is coming out of your new keyboard

Hope that helps.

Sorry about that, its just the G5 keyboard. I was wondering about it so I logged off and got onto my old computer and realized that the G5 keyboard spits out different stuff even though I am pushing the exact same buttons... Sorry 'bout that. I'll change it

Thanks for your replies,

Nix, the center command just centers objects horizontally, doesn't it? What I want to do is center an image, both horizontally and vertically using good old HTML.

Thanks Tony for the tip, saying I could "set the image as a background image". But I don't want to use CSS. I want to do it was HTML, hence this post being in the "Off Topic" part of the Forum.

Alan

Well since we're off-topic and using HTML, would something like... (deep breath...)

<table>
<tr><td align=center valign=middle>
<img blah>
</td></tr>
</table>

work?

Hi DJomp,

I've implemented your code. The "valign=middle" property works with an HTML 4.0 Transitional Doc Type with URL. However, since the image that is being vertically aligned has to be within a table, then that table has to stretch to the full height of the browser window, to centre the image in the middle of the browser window (vertically).

And there's the problem.

table height="100%" is not compatiable with an HTML 4.0 Transitional Doc Type with URL. So, how do I make the table stretch to the height of the browser window?

In this example, that uses your valign code, I've set the height of the table to a fixed amount, 400px:

http://www.warrender.hillingdon.sch.uk/htmlcentring/centring3.htm

Yeah I did mean to add width=100%; height=100% just forgot.

Not sure of other ways, will ponder it a bit...

Anyone got any ideas how to do it, yet?

To recap, all I want to be able to do is this...
http://www.warrender.hillingdon.sch.uk/htmlcentring/centring1.htm

... but with an HTML 4.0 Transitional Doc Type with URL. It surely must be possible. It sounds so simple.

Alan

You could use javascript, but I'd rather chop off my balls personally.

The answer is CSS. Height has been deprecated BECAUSE of CSS. CSS is the replacement, it is the answer.

Use CSS.

CSS.

Here you go

.centreit
      {
      position:absolute;
      left:50%;
      top:50%;
      width:200px;
      height:200px;
      margin-left:-100px; 
      margin-top:-100px;
      background-color:#3366FF;
      }

Margin left and margin right, must be half the width and height.

EDIT: Just posted and then saw this http://www.csscreator.com/css-node/789

Regards
Day

Yes, well I have this CSS code already. The problem with it is, it can only be applied to one size of image. So, suppose you had lots of different images, of different sizes, you couldn't apply this one CSS style to all of them, to centre them on the page. You'd have to make a different style for each image.

So, CSS (well, that CSS) isn't the answer.

no... you make one generic class with the above css.. and then you use inline styles on each particular image to account for different placements.. simple...