<span> a <div> syntaxe

PetrIII
protože se zápis chová jako Odstavec se ukončí, je-li v něm „zanořen“ jiný blokový prvek, tedy „div“, „h1-h6“ aj.

Plati to i na IMG?

Podle pravidel HTML má odstavec nepovinnou koncovou značku. A protože <div> v <p> být nemůže, tak se před ním sám ukončí.

„Div a p jsem psal vždy obráceně.“
Chybně, protože <div> je oddíl a <p> odstavec. Těžko můžeš mít v odstavci více oddílů.


„Plati to i na IMG? “
Neplatí.

PetrIII
„Pomozte memu mozku pochopit“
a co nechápeš? DIV je jen kontejner, nenese žádnou sémantickou hodnotu, je to jen blok.

Odstavec snad víš, co je. Určitě jsi se s ním setkal třeba v knížce. Viděl jsi v něm někdy něco jiného než text? Předpokládám, že ne, protože odstavec slouží k členění textu. Stejně tak na webu.


„V divu nastavím pismo nejake., proste nejaky styl“
Ano, to lze. Stejně tak lze ostylovat odstavec.

„Přijde mi lofické, aby div byl vnořený v p“
Co je na tom logického?

„Divu muzu napsat treba 5 ale v rámci jednoho p“
To nemůžeš, ale můžeš napsat 5 odstavců v rámci jednoho bloku, divu.

PetrIII
Anebo ještě jinak:
<p> je blokový element, který nemůže (nejenže nesmí, ale konstrukčně je to v HTML neproveditelné) obsahovat jiné blokové prvky. Jakmile se pokusíš do <p> nacpat jiný blokový prvek (<div>, <h1> a podobně), odstavec se automaticky ukončí, aniž bys musel napsat </p>, neboli jako bys napsal.

<img> je řádkový prvek, proto může být v odstavci; jeho vložením není ukončen odstavec.

<div> je blokový prvek, který slouží jako obal jiným (blokovým i řádkovým) prvkům, neboli do <div>u můžeš nacpat co chceš, i jiné (vnořené) <div>y.

PetrIII
„že jsou si jakoby "rovny" svým významem“
nesjou si rovny, ale chovají se, co se zobrazení týče, stejně. Jde jim deklarovat některé vlastnosti, například rozměry „width“ a „height“, což řádkovým nejde.

Na druhou stranu, potřebuješ-li nadpis řádkový nebo odkaz „a“ jako blokový, lze manipulovat vlastností „display“ a hodnotami „inline“, resp. „block“. Vše, co plave (vlastnost „float“), je rovněž blokové.

PetrIII
Blok znamená, že jde o obdélník (čtverec) – když dáš blokovému prvku border nebo odlišný background-color, uvidíš to.

Oproti tomu řádkový (inline) prvek se může nacházet na nějakém řádku (nějakých řádcích), například <strong>tento úsek textu může začínat na konci jednoho a končit na začátku druhého řádku</strong>.

Krom toho jsou ještě prvky typu (css vlastnost display) table (<table>) a list-item (<ul>/<ol> – <li>), ale s trochou zjednodušení je můžeme považovat za blokové.

A jak správně píše panther, cokoli s vlastností float:left/right je blokové, i kdyby to původně blokové nebylo (<img>, <em>…).

Reaguji na Miloše a panthera:
Mícháte rozdělení elementů na blokové a řádkové s blokovým a řádkovým zobrazením. Člověk by pak mohl nabýt dojmu, že <a style="float: left"> nemůže být v odstavci a že <h1 style="display: inline"> v něm být může.

„potřebuješ-li nadpis řádkový nebo odkaz ‚a‘ jako blokový, lze manipulovat vlastností ‚display‘“
Ale nezmění to nic na tom, jestli smí dát dovnitř <div>.

„Krom toho jsou ještě prvky typu (css vlastnost display) table (<table>) a list-item (<ul>/<ol> – <li>), ale s trochou zjednodušení je můžeme považovat za blokové.“
Zmíněné elementy jsou opravdu blokové. Bez zjednodušování. I když se nastylují, že vypadají jinak, spadají do kategorie blokových, protože by měly vyznačovat blok informací.

Chamurappi
Já věděl, že to všechno uvedeš na pravou míru ;-)