Обычное вертикальное выравнивание картинки

Sleepwalker · 19.12.2010, 20:47

Я не профи, но всегда было интересно, ведь так же можно писать -

Код:

<table width="100%" height="100%"><tr height="100%"><td valign="middle" align="center">
<img src="imgs/gladiator.jpg"/>...

?
Только объясните почему, когда в самом начале присутствует тег

Код:

<!DOCTYPE html>

картинка не выравнивается посредине (остается вверху), стоит убрать этот порочный тег - все нормально, картинка в центре экрана. Какая связь? Что это за бред? Кто сталкивался? Как вообще правильно разместить картинку в центре экрана, чтоб было и просто и все положенные теги оставались?

membrilius · 19.12.2010, 23:11

ммм...
Тег DOCTYPE сообщает браузеру, что документ необходимо вывести с соблюдением определённого стандарта. Точнее сообщает какая версия (X)HTML используется при формировании документа, и в какой режим браузеру следует перейти для его отображения.

Тег имеет 3 стандарта и задает один из трех режимов. Описание вашего тега под не под одно описание не подходит.

Если DOCTYPE не используется или записан не правильно, браузер переходит в свой режим работы. У каждого браузера он свой, и следовательно отображение страниц может быть разным.

Sleepwalker · 22.12.2010, 00:59

Цитата:

Сообщение от membrilius

... Описание вашего тега под не под одно описание не ....

Я сократил написание, хотя и такой вариант существует (HTML 5, может слышали о таком?), но на самом деле поставь любой вариант, например

Код:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

или еще какой, так вертикальное выравнивание исчезает, причем в различных браузерах. Стоит только убрать тег - выравнивается. Можете проверить сами.

А ровнять конечно можно при помощи тогоже javascript, однако хотелось бы проще и быстрее.

membrilius · 22.12.2010, 13:13

да действительно HTML5 ... не сильно читал спецификацию, всёровно старые браузеры не поддерживают.

А на счёт вертикального выравнивания, это не оно не работает, а таблица 100% по вертикали не растягивается.

Это можно обойти, растягивая <html> и <body> на весь экран.

Я по другому выравниваю, допустим если с абсолютным позиционированием то так

Код:

#logo {
	position: absolute; 
	top: 50%; 
	left: 50%; 
	margin-left: -166px; // половина ширины блока/картинки
	margin-top: -90px; // половина высоты блока/картинки
}

можно с относительным позиционированием.

Sleepwalker · 03.01.2011, 22:07

Спасибо membrilius! Без css я вижу, никак нельзя

Кстати, а если тег DOCTYPE все-таки не использовать (при этом же таблица 100% по вертикали растягивается! ), то чем это чревато? То есть, насколько важен этот тег DOCTYPE?