Autor Zpráva
blackhorse
Profil
Začal som si upravovat forum, aby bolo validné, ale má jeden problém s tagom <caption> totižto. Mam hlavnu tabulku a v tej tabulke mam dalsiu tabulku
Toto je cast kodu z templatu Acidtech pre phpbb fora.

<table width="100%" cellpadding="2" cellspacing="0" class="forumline">
<thead>
<caption>
<table border="0" cellspacing="0" cellpadding="0" width="100%" class="forumheader">
<tr>
<td align="left" valign="bottom" width="25"><img src="templates/AcidTech/images/hdr_left.gif" width="25" height="27" alt="" /></td>
<td align="center" class="forumheader-mid"><a href="{catrow.U_VIEWCAT}"><font color="#00FF00">{catrow.CAT_DESC}</font></a></td>
<td align="right" valign="bottom" width="25"><img src="templates/AcidTech/images/hdr_right.gif" width="25" height="27" alt="" /></td>
</tr>
</table>
</caption>
</thead>

Takze vypisuje mi chybu ze v prvej tabulke chyba tag <tr> ak tam dam <tr> pise chybu ze <caption> isn´t allowed in <tr> element. Proste začarovaný kruh. Vedel by mi s tym niekot pomoct alebo poradit ako by sa to dalo inak zapisat? Ak zamzem caption tak mi to rozhdazde celu tabulku fora. Dakujem
Suji
Profil
<caption> dej hned za tag 1. tag <table ... > pred <thead> a vyhod z nej tu silenou tabulku, protoze caption je radkovy element, takze v nem tabulka nema co delat.
Trejpa
Profil
blackhorse
Chvilku mi trvalo, než jsem pochopil, co tím kódem zamýšlíš. Potom mi došlo, že to plánuješ jako vekou tabulku, která má v prvním řádku malou tabulku s navigací. Jen jsi nepochopil smysl značky <caption> a chováš se k ní jako k buňce roztažené na celou řádku tabulky - tím ale není.

Pokud trváš na tabulkách, tak máš dvě řešení:

1) horší, zůstane zanořeno:
Nahraď <caption>[vnitřní tabulka]</caption> za <tr><td colspan="X">[vnitřní tabulka]</td></tr>, kde X je počet (tzn. číslo) sloupců ve zbytku té velké obalovací tabulky; těch, co budou níže.

2) lepší - vynoř to
Podle toho, že vnitřní i vnější tabulka mají width="100%" usuzuji, že jde o to roztáhnout je obě stejně, takže by neměl být problém je napsat každou zvlášť. Pokud je vnější tabulka přes CSS na šířku omezována či pozicována, bude potom vhodné obě tabulky obalit pomocí <div> a některé styly aplikované původně na class="forumline" nastavit místo tabulky přímo jemu.


Značka <caption> je textový nadpis tabulky, který se může dát do tabulky jen těsně za značku <table> a nelze do něj vkládat blokové značky (třeba ten <table>).

http://www.jakpsatweb.cz/html/tabulky.html#caption
http://www.w3.org/TR/html401/struct/tables.html#h-11.2.2 (nahoře je příklad použití)
blackhorse
Profil
<caption> dej hned za tag 1. tag <table ... > pred <thead> a vyhod z nej tu silenou tabulku, protoze caption je radkovy element, takze v nem tabulka nema co delat.

Už som to aj takto skúšal, ale nepomohlo to.

Problem je v tom ze ten vzhlad uz bol navrhnuty a neviem kto ho takto riesil ze do caption vlozil tabulku.

Trejpa

Vedel by si mi ten druhy krok bližšie vysvetlit?
Trejpa
Profil
blackhorse
Vedel by si mi ten druhy krok bližšie vysvetlit?

Řešil bych se to takto:

<div class="obal">
<table ... class="forumheader"> <!-- původně vnitřní tabulka s nadpisem -->
<tr>
<td ...><img ... /></td>
<td ...><a href="{catrow.U_VIEWCAT}"><font ...>{catrow.CAT_DESC}</font></a></td>
<td ...><img ... /></td>
</tr>
</table>
<table ... class="forumline">

<!-- obsah původní vnější tabulky se zbytkem stránky -->

</table>
</div>

No a v CSS bych podle potřeby nastavil tomu <div> případné rozměry, okraje, pozici, obtékání a tabulkám bych zase vynuloval okraje, nastavil 100% šířku, nastavil rámečky a podobně (prostě div bude ovlivňovat chování k okolí a vše uzavírat, zatímco tabulky budou určovat vzhled). Pokud v původní šabloně kromě vnější tabulky nic jiného není (třeba postranní menu), tak tam ten <div> ani dávat nemusíš.




Zpět. Protože jsem přehlédl, že nejedná se o navigaci, ale tabulkou tvořený nadpis, tak by to mohlo bez tabulky, při zachování podobného vzhledu, vypadat asi takto (CSS bych ale použil externě):


<h2 style="background:url(templates/AcidTech/images/hdr_left.gif) no-repeat left center;font-size:100%;text-align:center;">
<span style="display:block;padding:0 25px;background:url(templates/AcidTech/images/hdr_right.gif) no-repeat right center;min-height:27px;_height:27px;">
<a href="{catrow.U_VIEWCAT}" style="color:#0f0;display:block;padding:0.2em 0;">{catrow.CAT_DESC}</a>
</span></h2>

<table ... class="forumline">
<!-- obsah původní vnější tabulky se zbytkem stránky -->
</table>
Toto téma je uzamčeno. Odpověď nelze zaslat.