ugrás a tartalomhoz

Bekezdésbe tett táblázat nem valid?

td · 2005. Szep. 19. (H), 12.49
Az a gondom, hogy van egy basic oldal, semmi különös hókuszpókusz, amit meg kéne normálisan formázni. Viszont valami gubanc lehet, amire nem jöttem rá. Arra vagyok kíváncsi, rossz-e a DTD, és attól hülyülnek-e meg biz. dolgok, vagy valami más gond van.

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

Van egy div a body-n belül, a divben pedig bekezdések. A bekezdések előtt h6-ok, némely P-ben pedig képdobozok, table-vel. Namost én úgy nézem, minden tiszta, mégis a Validator azt dobja ki, hogy: "Error Line 39 column 601: end tag for element "P" which is not open.", 3x is, pedig be van zárva jól mind. Mi zavarhatja meg? (Lehet táblázatot szövegbe tenni?)

Továbbá bizonyos dolgok nem stimmelnek biz. böngészőkben. Pl. FF-ben azok a bekezdések, ahol kép van, középre igazított szövegűvé válnak, és a betűtípus/stílus (font, méret) sem stimmel. Sem IE6, sem FF nem teszi ki a bekezdések mögé a beállított 50px margót (hogy legyen némi távolság). NN7 a képdobozok mellett sem hagy margót.

Röviden ennyi, ennyit vettem észre. Az oldal címe:
http://dropzone.uw.hu/b/td_beszamolo-page1.html
‹ listás menü pozícionálása az oldal szélére Submit-on ronda a kép ›
 ■
1

Tipp

Poetro · 2005. Szep. 19. (H), 13.05
Valami nincs lezárva, vagy egy elem olyan elemet tartalmaz, amit nem lehet a DTD szerint. Lehet a P-n belül nem lehet TABLE, vagy valami hasnoló lehet a bukfenc.
--------
Poetro
2

ludas table

td · 2005. Szep. 19. (H), 13.11
Én is csak erre tudtam gondolni, de: több bekezdésben van table annál, mint amennyit a validator jelez. Ezért nem vagyok benne biztos, ráadásul az ilyet észre is szokta venni, úgy tudom.
3

Nem kötelező lezárni a <p>-t

Török Gábor · 2005. Szep. 19. (H), 13.22
<table> elem nem állhat <p>-n belül. Ha átállítod a DTD-t ilyenkor XHTML-re, sokat segíthet:

document type does not allow element "table" here;

Azért háromszor szól, mert a záró </p> tagek a hibásak csak, hiszen HTML 4.01 Tr-ban nem kötelező lezárni a <p>-t, így amikor a <p> után a <table> következik, ő automatikusan lezártnak tekinti azt.
4

Tele van hibával a stíluslapod

Török Gábor · 2005. Szep. 19. (H), 13.27
Az oldal pedig azért néz ki furcsán a böngészőkben, mert a stíluslapod hemzseg a hibáktól: W3C CSS Validator Results

Leggyakoribb hibád, hogy a többértékes tulajdonságok paramétereit vesszővel választod el. Nem kell vessző! Ha bizonytalan vagy a témában, itt a Weblaboron van egy nagyon klassz CSS cikksorozat.
5

THX!

td · 2005. Szep. 19. (H), 13.40
Köszi a válaszokat, nem is tudom, hol járt az eszem azokkal a vesszőkkel!

Nem tudod megmondani, hogy akkor mi állhat a P-n belül? Div mehet oda? Mert jó nekem az XHTML, de ha nem úgy szolgálja ki a szerver, akkor megint csak gond lehet. Kivéve talán, ha az úgy OK-s, ha meta-ban megadom magam xml/.....-ra.
6

P mint paragrafus

Török Gábor · 2005. Szep. 19. (H), 14.22
A <p> tag alapvetően szöveg- és képtartalmak befogadására találtatott ki, egészen pontosan nem tartalmazhat blokk szintű elemet. Ha bizonytalan vagy egy elem szemantikailag helyes használatában, keresd fel bátran a referenciát. HTML és XHTML ebből a szempontból majdnem lényegtelen.

A te esetedben teljesen felesleges a táblázatot paragrafusba rakni. Sőt, oldalszerkezet kialakításhoz nem is helyénvaló táblázatot használni, használj helyette CSS-t.
7

hogyan?

td · 2005. Szep. 19. (H), 19.25
No de figyelj (láma kérdés jön): akkor hogyan tegyek bekezdésbe képet aláírással úgy, hogy közös hátterük (esetünkben fekete) legyen, és ne sértse a szabványt, vagy az adott DTD-t? És persze hogy a szöveg is körbefolyja?

Mellesleg nálam a table display: inline attribútumot kapott, tehát onnantól kezdve nem is blokk elem.

Egyébként ebben az esetben az is gondot okozhat XHTML esetén, hogy az oldal, ahova ez a cikk megy, target="_new"-kat használ a képek nagybani megtekintésére, ami már a strict HTML4.01-ben sem megengedett.
8

Float tulajdonsággal

Török Gábor · 2005. Szep. 19. (H), 19.53
A képet az aláírással közös konténerbe teszed, majd őket jobbra csúsztatod a float CSS tulajdonsággal, végül pedig a képet és a körülötte lévő szöveget is közös foglalóba teszed. Valahogy így:

.szoveg {
        /* Közös háttérszín */
	background: #aaa;
}
.kep {
        /* Melyik írányba szeretnéd igazítani */
	float: right;
        /* Közös háttérszín */
	background: #aaa;
}
A HTML kód pedig:

<div class="szoveg">
	<div class="kep">
	<img src="/nature6.jpg" alt="" />
	<p class="alairas">Kep alatti szoveg</p>
	</div>
        Ide jön a szöveg.
</div>
Élőben valahogy így néz ki: td.html

A display: inline HTML validálásnál nem jelent semmit, hiszen az a stíluslap része, csak a megjelenést befolyásolja, a logikát nem.
9

div

td · 2005. Szep. 20. (K), 13.14
No és a div-nél nem a block az alapértelmezett (validálás)? Mert látom, a példádban is előbb a kép van, aztán a szöveg, mégcsak nem is p-ben (gondolom a szoveg div azért text-align: justify-s), de IE6-ban úgy jelent ez meg, hogy fent középen a kép az aláírással, alatta meg a szöveg. Tehát valahogy ez nem stimmel, mintha muszáj lenne az univerzalitás miatt p-be tenni. :(
10

Float + width

Török Gábor · 2005. Szep. 20. (K), 19.03
Bocsánat, én voltam figyelmetlen, a floatolt elemnek meg kell adni a szélességét is, úgy már működik IE alatt is.

.kep {
  float: right;
  width: 100px;
  /* stb. */
}
A DIV oké, hogy blokk szintű elem, de DIV-ek ágyazhatók egymásba, a P-re vonatkozik, hogy ő már csak inline elemet tartalmazhat.
11

p elfelejtve

td · 2005. Szep. 21. (Sze), 18.23
Micsoda buktatók! No de oké, tehát akkor felejtsem el a p-t, és legyen bekezdések helyett div. Gondolom, akkor onnantól kezdve minden működik ugyanúgy, vagyis, ha a szöveg közepébe teszem be a forrásban a kép-divet, akkor a megjelenítéskor is lejjeb lesz.
(Mellesleg az a width is egy érdekes téma, mert az IE egész máshogy értelmezi a doboz modellt. Ezzel is szenvedtem az adott cikknél, mert egyik így értelmezi, a másik meg úgy. És fekete háttér van, tehát elég jól látszik...)

Egy másik dolog is eszembe jutott ezzel kapcsolatban. Láttam ilyen table-s megoldást p-ben, de úgy, hogy a table-t körbefonták egy <ignore> taggel. Gondolom, ezt nem ismerik fel a böngészők, viszont alapból in-line-nak tekintik, és nem fog "bezáródni" a p tag. Persze a validatornak ez sem OK, de legalább a böngésző sem hülyül meg tőle. Szerintem.
12

Nem, a P-nek megvan a maga helye

Török Gábor · 2005. Szep. 21. (Sze), 19.36
Semmiféleképpen se felejtsd el. A DIV konténer szerepet tölt be, a P pedig hosszabb szöveg (képek stb.) befoglalására szolgál, de ez nem jelenti azt, hogy mindig kötelező használni. A jelenlegi problémát én P-vel nem tudom megoldani, de ettől függetlenül biztos lehet ügyeskedni, de a kód így is jó, valid, működőképes.

Olyan tageket semmiféleképpen se használj, ami nincs! Annak pedig továbbra sem látom értelmét, hogy táblázatot tegyél paragrafusba.
13

csak most

td · 2005. Szep. 23. (P), 18.57
Persze, úgy értettem, hogy mostanra felejtem el a P-t. Mert ha egyszer muszáj bele doboz, és nem lehet XHTML, akkor itt már csak az az út segít.