[HTML->XHTML] <td valign=""> nie działa

0

Hello :)

Chciałem sobie zamienić moją małą stronkę z HTML 4.0 na XHTML 1.0.
Obie wersje są poprawne wg walidatora w3c:
This Page Is Valid HTML 4.0 Transitional!
This Page Is Valid XHTML 1.0 Transitional!
Ale strona w XHTML nie wygląda jakbym chciał.

Tu jest treść strony w HTML 4.0:

<!DOCTYPE HTML PUBLIC "-*W3C*DTD HTML 4.0 Transitional//EN"> <html> <head> <title>local server</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <style type="text/css"> body {overflow: auto} table {width: 100%; height: 100%} img {border-width: 0px} </style> </head>

<body>
<table>
<tr valign="middle">
<td align="center"><img src="1cfaniak.gif" width="13" height="13" alt="cfaniak" title=""></td>
</tr>
</table>
</body>
</html>

</p>

A tu w XHTML 1.0

<!DOCTYPE html PUBLIC "-*W3C*DTD XHTML 1.0 Transitional*EN" "http:*www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> <title>local server</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/> <style type="text/css"> body {overflow: auto} table {width: 100%; height: 100%} img {border-width: 0px} </style> </head>

<body>
<table>
<tr valign="middle">
<td align="center"><img src="1cfaniak.gif" width="13" height="13" alt="cfaniak" title=""/></td>
</tr>
</table>
</body>
</html>

</p>

Problem w tym, że obrazek nie jest już na środku strony, a na górze. Czyli działa tylko wyśrodkowanie w poziomie.
Stwierdziłem, że to wina parametru valign.
Więc dodałem styl CSS:
tr {vertical-align: middle}
lecz to nic nie zmieniło.

Jak można to naprawić?
Stronę sprawdzałem w IE 6.0 i FF 1.0.2

0

moze wpisz zamiast
tr {vertical-align: middle}

to
tr {vertical-valign: middle}

ale to chyba nic nie da :/

0

może tak:

<img id="obraz" ...
a w stylach:
 #obraz  {
 	position: absolute;
	left: 100px;  //tutaj odpowiednie współrzędne
	top: 50px;	
 	width: 300px;
	height: 150px;
	}

nie wiem, czy pomoże, ale spróbuj ;P
źródło: http://www.wodzu.maciaszek.pl/dhtml/index.html

0

Dodaj:
html, body {
height: 100%;
}

W XHTML liczy się rozmiar od rodzica, a jeżeli rodzic nie ma ustawionego, to przyjmuje się najmniejsze pasujące do dziecka.

0

Dryobates - dzięki za wskazówkę - dziła.
Przyda się na przyszłość [browar]

[<font color="blue">dopisane</span>]
Poprawka...
Działa ale pojawiają się 2 scrolle :/ Więc takie rozwiązanie odpada...

0

problemem jest margin i padding strony. Ustaw obydwa 0px; i scroll zniknie.

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">    
<head>
<title>local server</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<style type="text/css">
body, html { height: 100%; overflow: auto; margin: 0px; padding: 0px;}
table        {width: 100%; height: 100%;}
img          {border-width: 0px;}
</style>
</head>
<body>
	<table>
	<tbody>
	<tr valign="middle">
		<td align="center">
			<img src="cfaniak.gif" width="13" height="13" alt="cfaniak" title=""/>
		</td>
	</tr>
	</tbody>
	</table>
</body>
</html>

u mnie to działa na pliku z rozszerzeniem html jak i xhtml.
Przeglądarki: IE 6.0 + SP1, FF 1.0, O 7.45u2

0

No, no... dzięki - wsio ok już.

0

ja tylko dodam ze u mnie wystarczy dodac
<img style="vertical-align: middle;" (...)
i juz dziala

na konquerorze u mnie.... na ie tez powinno....

0
Endrju napisał(a)

na ie tez powinno....
Ani na IE ani na FF - przykro mi. Wersja Dryo+Angela działa więc temat uważam za zamknięty.

1 użytkowników online, w tym zalogowanych: 0, gości: 1