W3C home > Mailing lists > Public > www-style@w3.org > November 2001

Re: How to vertical align an image?

From: <schinkel@rz.uni-potsdam.de>
Date: Sun, 11 Nov 2001 18:36:15 +0100
Message-Id: <200111111738.fABHcCX11147@persius.rz.uni-potsdam.de>
To: www-style@w3.org
CC: w@tson.dk
11.11.2001 17:22:16, "Thomas Watson" <w@tson.dk> wrote:

>I have a XHTML page (v1.1) where I have only one image. I want this
>image to be displayed in the middle of the browser (both horisontal an
>vertical aligned that is). 
>This is my document type:
><?xml version="1.0" encoding="iso-8859-1"?>
><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
>And this is how I try to position my image:
><div style="height: 100%; text-align: center;">
>	<img src="ddjalogo.gif" width="640" height="329" alt="" />
>My style attribute on the div-tag only has a height and a text-align.
>The text-align style centers the image horisontaly. But how to I center
>the image verticaly?
>I've been searching the web for quite some time now without even finding
>documents about this problem. Am I missing something here? Or is there
>no way at all to do this?
>- Hope some of you can help me :)

Possibly you could use a style tag like this:
	<div style="margin-top: 50%; height: 100%; margin-left:50%;">
	<img src="ddjalogo.gif" width="640" height="329" alt="" />
you can also use absolute values (i.e. pt) for positioning, but I would recommend using relative values 

alternativly "padding left/top" may do the job. 

if my information is not enough

Hope I could help you
Received on Sunday, 11 November 2001 12:38:18 UTC

This archive was generated by hypermail 2.3.1 : Monday, 2 May 2016 14:26:59 UTC