HTML táblázatban képek - illesztési gond
Sziasztok!
Nemrég kezdtem a HTML tanulást(komolyabban) és most a táblázatnál van egy kis problémám, ugyanis szerettem volna 1 táblázaton belül 2 egymás alatt lévő cellába úgy képet illeszteni, hogy azok összeérjenek(tudom, miért nem egyesítem a két cellát a rowspan-al és így egybe lenne és nem lenne gond....de most az elmélet a lényeg).
Beállítás:
table cellspacing="0" cellpadding="0" border="0"
Táblázatnak nem adtam méretet, tehát akorára nyújtja amekkora a benne lévő kép. Így össze kellene érniük, nem? Próbáltam úgy is hogy a képbelinkelésnél használtam a border="0" állítást de semmit nem számított.
Időközben azonban előállt egy másik probléma is mint az adott linken látható:
http://www.fw.hu/aquir-lord/tabla.html
A táblázat bármelyik sorában a harmadik cellában valahogy más igazítás érvényes a képre, mint a kettesben(az első cella direkt nem tartalmaz adatot, hátha a hiányzó TH elem miatt az első TD-re más formázást akar alkalmazni). Ha a valign="bottom" igazítást használom a TR en belül akkor a második cellára az érvényes is lesz és látni a változásd de viszont a harmadikban akkor sem változott semmi. Ha külön is beírom a harmadik cellához a TD-n belülre hogy valign="bottom" akkor sem változik semmi! Nézzétek meg a forrás, semmi extra nincs benne csak 1 tök egyszerű táblázat aminek a harmadik cellájában mindig más formázás érvényesül valamiért.
Erre kérnék pár ötletet, hogy ez mitől van!
Előre is köszönöm!
U.i.: ne ajánljátok a CSS-t a táblázat leváltására, mert majd arra is sor kerül de a HTML-t is meg akarom érteni rendesen.
■ Nemrég kezdtem a HTML tanulást(komolyabban) és most a táblázatnál van egy kis problémám, ugyanis szerettem volna 1 táblázaton belül 2 egymás alatt lévő cellába úgy képet illeszteni, hogy azok összeérjenek(tudom, miért nem egyesítem a két cellát a rowspan-al és így egybe lenne és nem lenne gond....de most az elmélet a lényeg).
Beállítás:
table cellspacing="0" cellpadding="0" border="0"
Táblázatnak nem adtam méretet, tehát akorára nyújtja amekkora a benne lévő kép. Így össze kellene érniük, nem? Próbáltam úgy is hogy a képbelinkelésnél használtam a border="0" állítást de semmit nem számított.
Időközben azonban előállt egy másik probléma is mint az adott linken látható:
http://www.fw.hu/aquir-lord/tabla.html
A táblázat bármelyik sorában a harmadik cellában valahogy más igazítás érvényes a képre, mint a kettesben(az első cella direkt nem tartalmaz adatot, hátha a hiányzó TH elem miatt az első TD-re más formázást akar alkalmazni). Ha a valign="bottom" igazítást használom a TR en belül akkor a második cellára az érvényes is lesz és látni a változásd de viszont a harmadikban akkor sem változott semmi. Ha külön is beírom a harmadik cellához a TD-n belülre hogy valign="bottom" akkor sem változik semmi! Nézzétek meg a forrás, semmi extra nincs benne csak 1 tök egyszerű táblázat aminek a harmadik cellájában mindig más formázás érvényesül valamiért.
Erre kérnék pár ötletet, hogy ez mitől van!
Előre is köszönöm!
U.i.: ne ajánljátok a CSS-t a táblázat leváltására, mert majd arra is sor kerül de a HTML-t is meg akarom érteni rendesen.
HTML szabvány
--------
Poetro
html megértése
Végül pedig ne akarj megtanulni valamit, amivel majd több munkád lesz, hogy elfelejtsd, ha CSS formázásra szeretnél áttérni. Sokkal könnyebb egyből CSS formázást megtanulni, mint táblázatos oldalszerkezeteket kialakítani, aztán áttérni.
Most akkor ki tudja rosszul???
"Table rows: The TR element" "Table cells: The TH and TD elements" és mindnél ez van:"Start tag: required, End tag: optional"
Az új TD vagy TR elem lezárja az előzőt!!!
Szóval miről beszéltek?????
Amit írtál hogy létrehoztam 1 oszlopot amibe semmit nem tettem azt is tudom! Ha átolvastad az írásomat akkor ott láthattad, hogy leírtam az okát is! Az az üres oszlop egyébként nem befolyásolhat mást.
Írtad:"Ezek nálam szépen összeérnek" Én arra mondtam hogy nem ér össze ami - bármelyik sorban - a második és harmadik oszlopban van. Pontosítva: összeérnek, de kb 1mm-es elcsúszás van az aljánál és a tetejénél(Explorer) ez az egyik gond. Az már csak mellékes, hogy azt akartom hogy az alatta lévő táblázatsorban lévő képpel is egybeérjen, mármint hogy ne legyen rés köztük.
Ha tinálatok továbbra sem látni elcsúszást akkor belinkelek egy PrintScreen képet én hogy látom: http://aquir-lord.freeweb.hu/kepek/printscreen.JPG
Itt látni hogy 1 sorban ami két kép van a 2. cellában azzal nincs gond, azok jól illeszkednek, de ami a 3. cellában van kép az már elcsúszik az előbbi kettőhöz képest! Amúgy eredetileg azt is akartam, hogy a táblázat első és második sora között látszó vízszintes fehér rész is eltünjön.
Poetro: ha erre a TD TR elemekre gondoltál amit nem zártam le (mire másra hiszen majd az egész csak ebből áll és a többi le van zárva), akkor most kinek kell megtanulnia a szabványt? Ha azt írja, hogy elhagyható akkor biztos az is. Valószínű odaírták volna ha kötelező lenne!
Ha valamit én tudnék mégis rosszul, akkor nem modortalan hozzászólást kérek majd, hanem nyugodt kiigazítást! Thx. és Üdv.
Szabvány és IE
Az Internet Explorer igenis megköveteli egyes elemek bezárását (mint pl a td és a tr), de a böngészők (Firefox, Opera), amelyek követik a szabványt, nem. Firefoxban, és Operában ezért tökéletesen is néz ki a tartalom.
Ez Internet Explorer nyelvén általában azt jelenti hogy az opcionális elemek kötelezővé válnak, de egyes esetekben más finomságok is előjönnek IE alatt. Érdemes ezért nem csak IE alatt megnézni a tartalmat, hanem egy böngészőben is, ami követi a szabványokat.
--------
Poetro
Köszönöm a segítséget
Ezzel most tényleg segítettél. Jó tudni hogy a szabványban sem lehet megbízni,bár ez nem a szabvány hibája de attól hogy betartom a szabványt és jól működik pl. Opera alatt attól még nem érek vele semmit mert nagyon sokan Explorer-t használnak. :( Tudom hogy több böngészővel is le kell ellenőrizni az eredményt, mert attól, hogy az egyiken jó attól a másikon még nem feltétlenül, csak itt épp ellenkező volt a helyzet :) , mert itt már az elsővel sem volt jó, éppen ezért nem tartottam fontosnak ellenőrizni a többivel hiszen akkor az én kódomban van a hiba. Úgy látom picit rugalmasabban kell hozzáálnom a szabványhoz, nem kell mindent biztosnak venni amit írnak!
Köszönöm szépen mégegyszer ezt a választ!
Üdv.
FF + Opera, utána IE
Ne engedd, hogy becsapjon az IE elterjedtsége! Tudod: "Együnk sz.rt, több milliárd légy nem tévedhet!"
Érdemes leszedni Firefoxhoz extensionként, vagyis kiterjesztésként a Web Developer Toolbart, valamint a Fangs Screen Reader emulátort. Ezekkel már elég szépen el lehet indulni.
Ja, és nem tudom, mikori a könyved, de ha ilyesmiket ír, szvsz dobd el, és nézz szét a neten forrásokért. Ez például nem néz ki rosszul.
A szabványok pedig jók, ha a megfelelőeket nézed.
A szóköz a gond
Egy nagyon régi hibáról van szó: az utolsó kép után mindig van egy újsor és egy space, az IE pedig (nem is teljesen elítélhető modon) a képet ehhez a "szöveghez" igazítja. A többi szóköz nélküli cellában persze nincs gond. Ha minden whitespace-t kitörölsz a táblázatból (az újsort is!), akkor jó lesz. A tagek lezárásával persze ugyanezt el lehet érni úgy, hogy a kód is átlátható marad.
Érdemes a többiekre hallgatni.
(Az üres oszlopot az elejéről pedig nyugodtan kidobhatod, mert ha te nem, a böngésző úgyis megteszi.)
Tényleg a szóköz a gond
Köszönöm a hasznos tanácsot!
További jó munkát/szórakozást kívánok mindenkinek!
tagek lezárása jól formázottság
Ha tanácsot kérsz
Az első 2 hozzászólásban jaavasolták, hogy zárd le a tageket. Ha úgy tettél volna, akkor rögtönn kiugrik, hogy a 7. hozzászólasban vázolt hiba van-e vagy sem. Ugyanis ha ott van </td> közvetlenül az img vegenel, akkor nem kerulhet be a kódba nemkívánatos space vagy soremelés.
Azt mondták, hogy van a kódban egy felesleges cella, vedd ki. Erre te megindokoltad, hogy miért nem veszed ki. Az indoklásod helytelen. A browser nem gondolkodik, es probál más formázást alkalmazni az első td-re. Ő csak egy td taget lat es ugyanugy kezeli le a sor vegen, mint a sor elejen, nem szamolgat.
Egy szó mint száz: kérdezni kell, mert csak úgy tanulhatsz, és spórolhatsz meg hosszú órákat, a tanácsot viszont nem bírálni kell, hanem megfogadni!
További jó tanulást kívánok
toro
Tanács és fölös cella (félreértés?)
Utánna mint láthattad tudtunk normálisan beszélni és meg is köszöntem a hasznos segítséget!
Visszatérve a témához, ami a felesleges cellákat illeti én az indoklásommal arra céloztam, hogy a hiba nem attól van, hiszen az üres cella nem befolyásol semmit(mint azt más is írta) és ne azt nézzék, mert azt én csak azért raktam bele, hogy kiküszöböljem a lehetőségét is annak, hogy a böngésző a TH hiányában az első TD cellán alkalmazzon valami formázást. A böngésző nem gondolkodik de akik a böngészőt létrehozták nem tudom, hogy nem-e írtak valami ilyesmit is bele, sajnos nem én csináltam egyik böngészőt sem! Mostmár tudom, hogy nem alkalmaz, mert írtátok! Ismétlen, az indoklással csak azt akartam kifejezni, hogy azt ne figyeljétek, azzal ne törődjetek hisz nem befolyásol semmit csak magam megnyugtatására tettem bele, hogy az esetleges hibalehetőségeket szűkítsem, ha a fentebb vázolt probléma emiatt lenne! Úgy látom nem értem el célomat, mert te is fennakadtál rajta! :) (nem kötekedésképpen mondom - annyi a félreértés, hogy már ezt is közölni kell) Nem így akarok HTML-t készíteni majd, csak most raktam bele, a hibakeresés miatt.
Egyébként elősször felettébb meglepett, hogy az első 2 hozzászólásban rögtön azzal indítanak, hogy nem zártam le a TD TR tag-eket, mintha még senki nem hallott volna arról, hogy nem kell lezárni, mert a következő lezárja. Mostmár persze tudom, hogy azért mert ők a gyakorlatot követik, ami már bevált!
Ha az elején megfogadtam volna a tanácsot, hogy zárjam le a tag-eket, akkor most nem tudnám, miért kell lezárni csak azt, hogy le kell, hiába mondja a szabvány, hogy nem muszály! Így most igazából jobban jártam, :) de mint említettem nem ezért mondtam ellent az elején!
Amúgy mindenkinek köszönöm az építő jellegű hozzászólást, és a kritikát is!
Remélem senkivel nincs harag.
Üdv. Aquir