Alignment Issue

HTML & CSS
1

Hello,

I am trying to get my image to aligh to the center of the page, I though this was easy to do but my code isn’t working, any ideas?

<img align=“middle” src=“http://www.askaboutvalidation.com/e-learning/e-books/GDP/gdp_downloadsample2.png” alt=“Download Sample” height=“75” width=“200”/>

Cheers in advance

G

2

  1. You shouldn’t be using the ALIGN attribute as that’s deprecated in strict for a reason; that reason being it’s a half-assed outdated coding technique.

  2. You do NOT need a div around it as XHTMLcoder suggests - waste of code.

  3. put class=“plate” on it (since a large centered image is probably a plate in the typographical sense) and then do this for CSS


.plate {
  display:block;
  margin:0 auto;
}

End of problem.

Again, attributes like ALIGN and COLOR, and tags like FONT and CENTER have NO PLACE IN MODERN MARKUP. That’s CSS’ job!

3

<ot>No, I wasn’t suggesting wrapping it in a block-level; what I meant was just to prove a point the ‘demo’ was functioning.

Yes, “poor sentence structure” (oops) but I am still not sure what the question was really asking; vertical, horizontal or both?</ot>

I basically agree the with the all the items mentioned regarding using CSS over deprecated attributes, etc.

4

There are various methods to “align” the image however what you have done is use; align=“middle” (aligns the centre of the image with the current baseline) which would align the image vertically are you trying to align the image vertically or horizontally?

In either case you’d find it easier if you wrapped the image in a block of a specific size so you could see the effects of your alignment (as it does work) but I am not sure that is what you are actually after.