[XHTML/HTML] Formatovani bez tabulek

**Lopan** · 31.01.2005, 22:21

Vsimam si, ze se stalo "modnim" nemit stranky pomoci <table> a par "uchylnych" jedincu to povazuje za jedine spravne psani stranek.
Docela by me zajimalo jak na to, pokud mam uvedeny <!DOCTYPE>, kdyz toto nefunguje

Kód:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
     "http&#58;//www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http&#58;//www.w3.org/1999/xhtml" xml&#58;lang="cs" lang="cs">
<head>
	<title>aaa</title> 
</head>	
<body>
	<div style="width&#58; 100%">
		<span style="width&#58; 50%; text-align&#58; left; border&#58; 1px solid">aaa</span><span style="width&#58; 50%; text-align&#58; right; border&#58; 1px solid">bbb</span>
	</div>
</body>
</html>

Bez <!DOCTYPE> to jede v pohode, ale nejsem prase abych neuvadel <!DOCTYPE>

Pokud to zaformatuju do tabulky

Kód:

<table style="width&#58; 100%">
  <tr>
    <td style="width&#58; 50%">aaa</td>
    <td style="width&#58; 50%">bbb</td>
  </tr>
</table>

tak to jede bez problemu.

Ted, v cem je vyhoda neformatovat pomoci tabulek? Prehlednejsi kod, kdyz <span> musim cpat na jeden dlouhy radek

Neco me asi unika.....

**jedik** · 31.01.2005, 23:30

To ze to nefunguje je spravne. A presne podle specifikace. To ze to IE v quirk modu(bez DOCTYPE) zobrazuje je jen jeho bug!

Atribut width totiz na radkove elementy nefunguje.

Sirku radkoveho elementu urcis bud tak, ze mu udelas pading(-left/-right) nebo ho oznacis jako blokovy(display:block).

Pokud chces udelat 2 sloupcovy layout tak udelej normalne dva divy jeden jako float:left a druhy jako float:right + upravit dle tvych pozadavku.

**PiT** · 31.01.2005, 23:47

jedik:

Ako potom spravis nieco taketo

Kód:

<table style="width&#58; 100%; background-color&#58; #000000;" cellspacing="1" cellpadding="0" border="0">
  <tr>
    <td style="width&#58; 50%; background-color&#58; #ffffff;">aaa</td>
    <td style="width&#58; 50%; background-color&#58; #ffffff;">bbb</td>
  </tr>
</table>

**jedik** · 01.02.2005, 00:14

Treba:

Kód:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
     "http&#58;//www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http&#58;//www.w3.org/1999/xhtml" xml&#58;lang="cs" lang="cs">
<head>
   <title>aaa</title>
</head>   
<body>
   <div style="width&#58; 100%;background-color&#58; red;padding&#58;2px;">
      <div style="width&#58; 50%; background-color&#58; blue; float&#58; left; ">aaa</div>
      <div style="width&#58; 50%; background-color&#58; green; float&#58; right;">bbb</div>
      <div style="clear&#58;both;"></div>
   </div>
</body>
</html>

S podruznostmi jako paddingy a marginy si uz lze hrat dle libosti

**PiT** · 01.02.2005, 00:43

jedik:

Sprav plz PRESNE take iste, ako som pozadoval

**Lopan** · 01.02.2005, 11:26

Reseni zajimave, ale nedostatecne. Padding se napr. v Opere a IE chova jinak a pokud mam generovany text v divu, ktery zalamuji a meni se mu vyska, tak se me rozhodi cele formatovani radku, dalsi div se neprizpusobi.

Drobnosti, ktere me stale utvrzuji v tom, ze nepouzivat tabulky je prinejmensim sebemrskacske.

Pak je jeste dalsi problem, ze nekdo nori desitky tabulek do sebe (napr. phpBB

) a pak je nemozne se v tom vyznat, ale to je zase druhy extrem.

**jedik** · 01.02.2005, 12:50

2Lopan: Zakldani tvrzeni vychazi z toho ze do tabulek by se meli davat tabulkova data(napr. prispevky zde na 4u). Co jsou a co nejsou tabulkova data je predmetem vecnych sporu, usudek si udelej sam. A nevnimej ty ortodoxni hnupy co prolizaji weby a hledaji nespravne pouzite tabulky

Jinak ty box-modelove chyby IE se musi zelbohu resit CSS hacky. Ale na vine je IE.

2PiT: ty k tomu spatne pristupujes, neni cilem pripodobit CSS pozicovani tabulkam. Mysli v CSS a netransformuj tabulky

BTW: tj standardni vymluva

Pak se na to mrknu ale ted tizi zkousky :/

**howard** · 01.02.2005, 12:59

Pouziti tabulek je vice kompatibilni i s ohledem na starsi prohlizece. (napr. IE, ze?) To je jejich velike plus.
Ovsem i zde narazite nekdy na problemy, je treba si ty tabulky dobre navrhnout.

V soucasne dobe se jiz nedoporucuje tabulky prilis pouzivat z nekolika duvodu.
Jednim z nich jsou napr. systemy, ktere vam ctou stranku. Pokud mate moc tabulek, tak s tim maji problemy. Kod je prehlednejsi a pomoci stylu se necha delat mnohem vic veci, nez s tabulkama.
Rekl bych, ze DIVy jsou budoucnost.

Jenom se desim toho, kdy M$ nekdy vyda IE7, ktery urcite zase totalne podela vsechny mozny standardy.

**PiT** · 01.02.2005, 13:24

Původně odeslal jedik

2PiT: ty k tomu spatne pristupujes, neni cilem pripodobit CSS pozicovani tabulkam. Mysli v CSS a netransformuj tabulky

BTW: tj standardni vymluva

Pak se na to mrknu ale ted tizi zkousky :/

Njn, lenze pomocou tabuliek si spravim pomerne jednoducho akukolvek (aj zlozitu) kostru stranky... Pomocou DIVov resp. CSS tazko....

Původně odeslal howard

Rekl bych, ze DIVy jsou budoucnost.

Stojim si za tym, ze to, co zobrazis tabulkou (+ stylom aplikovanym na nu), sa ti DIVom (+ akokolvek nastavenym stylom) nepodari.

Uz len ten moj hlupy priklad... mas predel medzi bunkami (kazda je ohranicena 1nym pixlom, pricom dotykova plocha (stred) je tiez len jeden pixel)...

**jedik** · 01.02.2005, 13:49

2PiT:
Samozrejme, ze pozicovani neni vsemocne. Stejne tak jako tabulky. Tu vetu, ze to co pomoci tabulek udelas neudelas pomoci pozicovani, lze velmi lehce obratit a uvest protipriklady. Casto to nejde, nebo to jde velice tezko

Nemam rad deleni tabulky a pozicovani. IMHO by to melo jit ruku v ruce.

Ja pozicovani nepouzivam protoze je to "moderni" ale proste kdyz se to hodi a do jiste miry je to i pohodlnejsi.

**howard** · 01.02.2005, 14:54

Původně odeslal jedik

2PiT:
Samozrejme, ze pozicovani neni vsemocne. Stejne tak jako tabulky. Tu vetu, ze to co pomoci tabulek udelas neudelas pomoci pozicovani, lze velmi lehce obratit a uvest protipriklady. Casto to nejde, nebo to jde velice tezko

A jeste k tem problemum muzes priradit ruzne zobrazeni v ruznych browserech - u obou zpusobu jsou vselijake problemy.

**PiT** · 01.02.2005, 15:39

Původně odeslal jedik

Ja pozicovani nepouzivam protoze je to "moderni" ale proste kdyz se to hodi a do jiste miry je to i pohodlnejsi.

Kedy sa hodi

**jedik** · 01.02.2005, 16:44

Původně odeslal PiT

Původně odeslal jedik

Ja pozicovani nepouzivam protoze je to "moderni" ale proste kdyz se to hodi a do jiste miry je to i pohodlnejsi.

Kedy sa hodi

Tabulkami nasimulujes obtekane boxy?
Tabulkama prekryjes dva boxy?
Tabulkama nasimulujes umisteni nejakeho prvku na danou pozici(to sice i jo ale jakmile to budes chtit zmenit tak to ma vetsinou navaznost na celou tabulku)?

A to jsem vyjmenoval jen co me rychle napadlo.

**Jezevec** · 01.02.2005, 16:46

2PiT: Tu mas upravene to css tak aby to vypadalo (az na drobny posun) uplne stejne

.

Kód:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
     "http&#58;//www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http&#58;//www.w3.org/1999/xhtml" xml&#58;lang="cs" lang="cs">
<head>
   <title>aaa</title>
</head>   
<body>
   <div style="width&#58; 100%;background-color&#58; black;padding&#58;1px;">
      <div style="width&#58; 50%; background-color&#58; white; float&#58; left; ">aaa</div>
      <div style="width&#58; 50%; background-color&#58; white; float&#58; right;">
        <div style="width&#58; 1px; background-color&#58; black; float&#58; left; "></div>
      bbb</div>
      <div style="clear&#58;both;"></div>
   </div>
</body>
</html>

EDIT: Samo ze se to chova ponekud jinak nez tabulka, ale ono delat web jen proto aby "vypadal" je taky blbost.

EDIT2: Jo, kdyby nekoho napadlo napsat vice radku, tak ten sloupec s mene radky bude pak doplnen cernou, coz jde osetrit zabalenim do dalsiho divu.

**Lopan** · 01.02.2005, 17:44

4jedik: ale jak jsme uz psal, s promenlivou vyskou boxu si uz div neporadi. Na staticky obsah se hodi, ale na dynamicky bych to neriskoval.

Jinak pro zajemce
http://www.pixy.cz/dogma/dogmaw41/cs/

Nektere myslenky jsou dobre, nektere zcestne... ale stoji to za precteni.

**jedik** · 01.02.2005, 18:39

Původně odeslal Lopan

4jedik: ale jak jsme uz psal, s promenlivou vyskou boxu si uz div neporadi. Na staticky obsah se hodi, ale na dynamicky bych to neriskoval.

Nj to je nevyhoda pozicovani, vyska. A nejak nechapu cos myslel tim dynamickym webem. Pokud to chapu spravne tak to zas muzu obratit a ukazat ti priklady ktere by sly tabulkama resit velmi krkolome.

**Lopan** · 01.02.2005, 22:33

Nemyslel jsem dynamicky web, jen dynamicky obsah (napr. e-noviny).

Myslim, ze tady plati rozumny kompromis, cpat vsude div stejne jako cpat vsude tabulky je spatne reseni.

Téma: [XHTML/HTML] Formatovani bez tabulek

Nástroje témat

Zobrazení

[XHTML/HTML] Formatovani bez tabulek

Informace o tématu

Users Browsing this Thread

Pravidla přispívání