Často by se mi hodilo, kdyby termín a definice definičního seznamu byly na jednom řádku. Ani atribut compact v současnosti nefunguje (zapisoval jsem ho jak <dl compact>, tak i <dl compact="compact">.
Ve všech zde uváděných příkladech jsem dl dt a dt vynuloval margin s „pudinkem“ a termíny jsem udělal tučné.
I hledal jsem CSS řešení. První co mě napadlo, bylo display: inline. Aby ale všechno nebylo na jedné řádce, musel jem si vypomoci preudoprvkem :after, kterému jsem njastavil display: block a content: " ".
dt, dd {display: inline;}
dd:after {content: " "; display: block;}
dt:after {content: " "}
Nevýhoda je na bíle dni – IE nezná :after a Firefox neakceptuje pro daný pseudoprvek display: block, takže řešení pro 5 % návštěvníků s Operou. Mohl bych to dolepit <br>ekotem, ale to mi připadá velmi, opravdu velmi humpolácké.
dt {float: left; margin-right: 1ex;}
Pokud bych chtěl „tabulkové“ zarovnání, stačí nastavit floutkovi dostatečnou šířku, kvůli zvětšování písma pak nejlépe v em:
dt {float: left; margin-right: 1ex;}
dt {float: left; width: 6em;}
Zatímco první řešení, byť teoreticky správné, je nepoužitelné, u druhého nastává otázka, co se stane, když toho bude na stránce plavat trochu víc. Mám velké obavy, že v takovém případě by clear mohlo napáchat hodně škody.
Ještě by tu byla možnost s pozicováním, ale mám obavu, že krom velmi „útlých“ seznamů by za tu námahu nestálo:
dl {position: relative; height: 5.2em;}
dt, dd {position: absolute; left: 5px;}
.prvni {top: .5em;} dd.prvni {left: 6em;}
.druhy {top: 1.7em;} dd.druhy {left: 6em;}
.treti {top: 2.9em;} dd.treti {left: 6em;}
.ctvrty {top: 4.1em;} dd.ctvrty {left: 6em;}
Tak nevím; bylo by ještě nějaké (lidské !) řešení?