Autor Zpráva
srigi
Profil
Riešim usability problém - kcem maximálne robot/screen-reader privetivý HTML kód. Zároveň kcem ale dosiahnúť vzhľad tabov.



Prvé dve sekcie označujú poradie blokov v HTML kóde (zelené sú nadpisy - popisy tabov, modré sú wrappery obsahu). Je tam taká feature - obsah je iba pod práve aktívnym nadpisom. Po kliknutí na iný nadpis sa aktuálny obsah zahodí a pod príslušný nadpis sa natiahne jeho obsah (sekcia 1 vs. 2). Je to hlavne kvôli zmienenej usability. Tretia (spodná) sekcia ukazuje ako by to malo vypadať na stránke.

Toto nie je vobec ťažké dosiahnúť - môžem napr. zafloatovať nadpisy alebo im dať
display:inline-block
a obsahový wrapper absolútne napozicovať pod konštantne vysoké nadpisy.

Toto všetko je OK do momentu kým nekcem celú zostavu obaliť ďalším wrapperom:



Vtedy dôjde k takej nepknej veci (druhá na obrazku) - obalový wrapper bere do úvahy (aj to iba ak sa použije clearfix) iba zafloatované nadpisy. Obsahový wrapper je mimo tok dokumentu, takže je to úplne v poriadku.

Rád by som vás požiadal o nejakú ideu ako dosiahnuť jedno (zvolené poradie HTML kódu - veľmi nerád by som ho menil, hlavne kvôli nevidomým) aj druhé (tabovytý vzhľad, obalový wrapper zaclearovaný pekne až obsahovým wrapperom). Idealne nejakým čistým CSS riešením. JS by som na toto použil veľmi nerád.

THX.
panther
Profil
srigi:
tvůj popis jsem četl dvakrát a dvakrát jsem na konci zapomněl, co se psalo na začátku. Moc čtivé to není a potřetí to číst nebudu. První obrázek jsem navíc moc nepochopil.

Dle konce příspěvku to vypadá, že nějaké HTML už máš, budeš jej před námi schovávat? Kdybys k tomu dlouhému popisu problému přidal i odkaz, kde by se dala celá situace lépe představit, asi bych byl ochotnější věnovat tomuto problému trochu více času.
srigi
Profil
panther:

Ospravedlňujem sa - dúfal som, že práve obrazky budú dávať viac vypovednej info. Celá vec je na adrese http://sact.phpq.info. Skús div#main odobrať min-height a hneď pochopíš o čo mi ide.
srigi
Profil
Vyriesene inak, lock
Toto téma je uzamčeno. Odpověď nelze zaslat.

0