Apro questo topic per richiedere aiuto a tutti gli esperti di HTML per un problema emerso nella pagina della wiki dedicata a Mellario.
In particolare, come si può vedere, il problema riguarda il codice dell'albero genealogico, dove si vede un connettore che entra nella cella dedicata a Doran Martell.
La domanda è... perché si comporta così?
Qui il codice dell'albero genealogico:
<table style="border-collapse:collapse;"> <tr style="text-align:center;"> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="8" style="border:1px solid black; padding:0.2em; width:12em; height:2em; font-size:95%; background-color:#F7F7F7;">???</td> <td colspan="2" style="border:none; border-bottom:3px double black; width:3em; height:1em;"></td> <td rowspan="2" colspan="8" style="border:1px solid black; padding:0.2em; width:12em; height:2em; font-size:95%; background-color:#F7F7F7;">???</td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="8" style="border:1px solid black; padding:0.2em; width:12em; height:2em; font-size:95%; background-color:#F7F7F7;">???</td> <td colspan="2" style="border:none; border-bottom:3px double black; width:3em; height:1em;"></td> <td rowspan="2" colspan="8" style="border:1px solid black; padding:0.2em; width:12em; height:2em; font-size:95%; background-color:#F7F7F7;">???</td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> </tr> <tr style="text-align:center;"> <td style="border:none; border-right:1px solid black; width:1.5em; height:1em;"></td> <td style="border:none; width:1.5em; height:1em;"></td><td style="border:none; border-right:1px solid black; width:1.5em; height:1em;"></td> <td style="border:none; width:1.5em; height:1em;"></td> </tr> <tr style="text-align:center;"> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" style="border:none; border-right:1px solid black; width:1.5em; height:2em;"></td> <td rowspan="2" style="border:none; width:1.5em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" style="border:none; border-right:1px solid black; width:1.5em; height:2em;"></td> <td rowspan="2" style="border:none; width:1.5em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> </tr> <tr style="text-align:center;"> </tr> <tr style="text-align:center;"> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" style="border:none; width:1.5em; height:2em;"></td> <td rowspan="2" colspan="8" style="border:1px solid black; padding:0.2em; width:12em; height:2em; font-size:95%; background-color:#F7F7F7;">???</td> <td style="border:none; border-bottom:3px double black; width:1.5em; height:1em;"></td> <td colspan="2" style="border:none; border-bottom:3px double black; width:3em; height:1em;"></td> <td colspan="2" style="border:none; border-bottom:3px double black; width:3em; height:1em;"></td> <td colspan="2" style="border:none; border-bottom:3px double black; width:3em; height:1em;"></td> <td colspan="2" style="border:none; border-bottom:3px double black; width:3em; height:1em;"></td> <td colspan="2" style="border:none; border-bottom:3px double black; width:3em; height:1em;"></td> <td style="border:none; border-bottom:3px double black; width:1.5em; height:1em;"></td> <td rowspan="2" colspan="8" style="border:1px solid black; padding:0.2em; width:12em; height:2em; font-size:95%; background-color:#F7F7F7;">???</td> <td rowspan="2" style="border:none; width:1.5em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> </tr> <tr style="text-align:center;"> <td style="border:none; width:1.5em; height:1em;"></td> <td colspan="2" style="border:none; width:3em; height:1em;"></td> <td colspan="2" style="border:none; width:3em; height:1em;"></td> <td style="border:none; border-right:1px solid black; width:1.5em; height:1em;"></td> <td style="border:none; width:1.5em; height:1em;"></td> <td colspan="2" style="border:none; width:3em; height:1em;"></td> <td colspan="2" style="border:none; width:3em; height:1em;"></td> <td style="border:none; width:1.5em; height:1em;"></td> </tr> <tr style="text-align:center;"> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" style="border:none; border-right:1px solid black; width:1.5em; height:2em;"></td> <td rowspan="2" style="border:none; width:1.5em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> </tr> <tr style="text-align:center;"> </tr> <tr style="text-align:center;"> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" style="border:none; width:1.5em; height:2em;"></td> <td rowspan="2" colspan="8" style="border:1px solid black; padding:0.2em; width:12em; height:2em; font-size:95%; background-color:#F7F7F7;">Mellario</td> <td colspan="2" style="border:none; border-bottom:3px double black; width:3em; height:1em;"></td> <td rowspan="2" colspan="8" style="border:1px solid black; padding:0.2em; width:12em; height:2em; font-size:95%; background-color:#F7F7F7;">Doran Nymeros Martell</td> <td rowspan="2" style="border:none; width:1.5em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> </tr> <tr style="text-align:center;"> <td style="border:none; border-right:1px solid black; width:1.5em; height:1em;"></td> <td style="border:none; width:1.5em; height:1em;"></td> </tr> <tr style="text-align:center;"> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td colspan="2" style="border:none; width:3em; height:1em;"></td> <td colspan="2" style="border:none; border-bottom:1px solid black; width:3em; height:1em;"></td> <td colspan="2" style="border:none; border-bottom:1px solid black; width:3em; height:1em;"></td> <td colspan="2" style="border:none; border-bottom:1px solid black; width:3em; height:1em;"></td> <td colspan="2" style="border:none; border-bottom:1px solid black; width:3em; height:1em;"></td> <td style="border:none; border-bottom:1px solid black; width:1.5em; height:1em;"></td> <td style="border:none; border-right:1px solid black; border-bottom:1px solid black; width:1.5em; height:1em;"></td> <td style="border:none; border-bottom:1px solid black; width:1.5em; height:1em;"></td> <td style="border:none; border-bottom:1px solid black; width:1.5em; height:1em;"></td> <td colspan="2" style="border:none; border-bottom:1px solid black; width:3em; height:1em;"></td> <td colspan="2" style="border:none; border-bottom:1px solid black; width:3em; height:1em;"></td> <td colspan="2" style="border:none; border-bottom:1px solid black; width:3em; height:1em;"></td> <td colspan="2" style="border:none; border-bottom:1px solid black; width:3em; height:1em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> </tr> <tr style="text-align:center;"> <td colspan="2" style="border:none; border-right:1px solid black; width:3em; height:1em;"></td> <td colspan="2" style="border:none; width:3em; height:1em;"></td> <td colspan="2" style="border:none; width:3em; height:1em;"></td> <td colspan="2" style="border:none; width:3em; height:1em;"></td> <td colspan="2" style="border:none; width:3em; height:1em;"></td> <td style="border:none; width:1.5em; height:1em;"></td> <td style="border:none; border-right:1px solid black; width:1.5em; height:1em;"></td> <td style="border:none; width:1.5em; height:1em;"></td> <td style="border:none; width:1.5em; height:1em;"></td> <td colspan="2" style="border:none; width:3em; height:1em;"></td> <td colspan="2" style="border:none; width:3em; height:1em;"></td> <td colspan="2" style="border:none; width:3em; height:1em;"></td> <td colspan="2" style="border:none; border-right:1px solid black; width:3em; height:1em;"></td> </tr> <tr style="text-align:center;"> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="8" style="border:1px solid black; padding:0.2em; width:12em; height:2em; font-size:95%; background-color:#F7F7F7;">Arianne Nymeros Martell</td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="8" style="border:1px solid black; padding:0.2em; width:12em; height:2em; font-size:95%; background-color:#F7F7F7;">Quentyn Nymeros Martell</td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="8" style="border:1px solid black; padding:0.2em; width:12em; height:2em; font-size:95%; background-color:#F7F7F7;">Trystane Nymeros Martell</td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> </tr> <tr style="text-align:center;"> </tr> </table>
Dove si nasconde il problema? " />" />" />
Io come noto di HTML non capisco nulla.
Ma... sei sicuro? Dal computer che sto usando adesso, con Chrome, io non visualizzo alcun connettore dentro la cella di Doran; in compenso, vedo che varie celle hanno delle linee che escono a destra (Doran e i genitori di Mellario hanno una righina che esce dalla cella, in corrispondenza al margine alto e a quello basso; Mellario solo in corrispondenza a quello alto). Boh?!
EDIT: Ho fatto un piccolo controllo. Con il medesimo computer, con Firefox la visualizzazione è quella che descrivi tu (il connettore matrimoniale entra nella cella di Doran) mentre con Explorer è addirittura tutto a posto. Ri-boh?!
Guardo e vi dico.
Come browser ho firefox, midori e chromium.
Sono su ubuntu, quindi niente ie.
EDIT: Su firefox la visualizzazione è quella che descrive Beric, con midori il risultato è catastrofico... Allego screenshot?
RIEDIT: con midori e chromium la visualizzazione è quella descritta da Koorlick. Se vari browser lo visualizzano in modo diverso (e comunque errato), c'è un problema nell'html o nello stile. Do un'occhiata con scite e vi dico.
Con Explorer non ci sono problemi. Possibile che dipenda da qualche carattere non supportato dagli altri browser?
Safari da gli stessi problemi di Midori. " />
Ho provato a fare qualche prova, ed il problema sembrerebbe essere legato ad un qualche problema sul colspan.
In particolare, la maggior parte degli oggetti della tabella sono dei colspan="2", ed il problema si pone solo nelle righe in cui compaiono degli oggetti senza colspan non consecutivi, ovvero situazioni in cui si ha, per esempio:
|--|--|--|--|--|--|--|
|-|--|--|--|-|--|--|--|
Spero di essermi spiegato... " />
Per averne evidenza comunque basta sostituire nel codice di sopra dei "border:1px solid red;" al posto dei "border:none;".
Non so come mai si verifichi questa anomalia e non mi ricordavo di riscontrata oggi pomeriggio su Firefox mentre la vedo stasera su Safari.
Eppure il codice non mi sembra sbagliato...
Al di là dell'errore contingente, sarebbe opportuno inserire dentro ai td dei "box-sizing:border-box;", giusto per non avere disallineamenti legati allo spessore dei bordi?
Con Explorer non ci sono problemi. Possibile che dipenda da qualche carattere non supportato dagli altri browser?
Explorer secondo me è uno dei browser peggiori al mondo, che mal riproduce html e stile (che sia in un file css o incorporato nell'html), nonchè pessimo a livello di sicurezza.
Per quanto riguarda la questione caratteri, probabilmente è IE a non supportare determinati caratteri rispetto a tutti gli altri browser.
Per quanto riguarda i browser, qualcuno può controllare anche con opera?
Firefox, chromium (chrome), midori e safari sono "coperti".
Con Explorer non ci sono problemi. Possibile che dipenda da qualche carattere non supportato dagli altri browser?
Explorer secondo me è uno dei browser peggiori al mondo, che mal riproduce html e stile (che sia in un file css o incorporato nell'html), nonchè pessimo a livello di sicurezza.
Per quanto riguarda la questione caratteri, probabilmente è IE a non supportare determinati caratteri rispetto a tutti gli altri browser.
Nelle ultime versioni é migliorato, ma con FF o Chrome a disposizione, specie per lo sviluppo, davvero se ne puó fare a meno.
Ho lo stesso comportamento di Koorlik e concordo con Lord Beric che potrebbe essere un problema di colspan. Si potrebbe modificare manualmente i valori per ottenere qualcosa di corretto: ad esempio, ho modificato il colspan del primo nodo del secondo livello da 8 a 7, e la visualizzazione dell'intera riga in Chrome si é corretta. Sarebbe peró piú interessante sapere come viene generato il codice...
<table style="border-collapse:collapse;"> <tbody><tr style="text-align:center;"> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="8" style="border:1px solid black; padding:0.2em; width:12em; height:2em; font-size:95%; background-color:#F7F7F7;">???</td> <td colspan="2" style="border:none; border-bottom:3px double black; width:3em; height:1em;"></td> <td rowspan="2" colspan="8" style="border:1px solid black; padding:0.2em; width:12em; height:2em; font-size:95%; background-color:#F7F7F7;">???</td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="8" style="border:1px solid black; padding:0.2em; width:12em; height:2em; font-size:95%; background-color:#F7F7F7;">???</td> <td colspan="2" style="border:none; border-bottom:3px double black; width:3em; height:1em;"></td> <td rowspan="2" colspan="8" style="border:1px solid black; padding:0.2em; width:12em; height:2em; font-size:95%; background-color:#F7F7F7;">???</td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> </tr> <tr style="text-align:center;"> <td style="border:none; border-right:1px solid black; width:1.5em; height:1em;"></td> <td style="border:none; width:1.5em; height:1em;"></td><td style="border:none; border-right:1px solid black; width:1.5em; height:1em;"></td> <td style="border:none; width:1.5em; height:1em;"></td> </tr> <tr style="text-align:center;"> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" style="border:none; border-right:1px solid black; width:1.5em; height:2em;"></td> <td rowspan="2" style="border:none; width:1.5em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" style="border:none; border-right:1px solid black; width:1.5em; height:2em;"></td> <td rowspan="2" style="border:none; width:1.5em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> </tr> <tr style="text-align:center;"> </tr> <tr style="text-align:center;"> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" style="border:none; width:1.5em; height:2em;"></td> <td rowspan="2" colspan="7" style="border:1px solid black; padding:0.2em; width:12em; height:2em; font-size:95%; background-color:#F7F7F7;">???</td> <td style="border:none; border-bottom:3px double black; width:1.5em; height:1em;"></td> <td colspan="2" style="border:none; border-bottom:3px double black; width:3em; height:1em;"></td> <td colspan="2" style="border:none; border-bottom:3px double black; width:3em; height:1em;"></td> <td colspan="2" style="border:none; border-bottom:3px double black; width:3em; height:1em;"></td> <td colspan="2" style="border:none; border-bottom:3px double black; width:3em; height:1em;"></td> <td colspan="2" style="border:none; border-bottom:3px double black; width:3em; height:1em;"></td> <td style="border:none; border-bottom:3px double black; width:1.5em; height:1em;"></td> <td rowspan="2" colspan="8" style="border:1px solid black; padding:0.2em; width:12em; height:2em; font-size:95%; background-color:#F7F7F7;">???</td> <td rowspan="2" style="border:none; width:1.5em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> </tr> <tr style="text-align:center;"> <td style="border:none; width:1.5em; height:1em;"></td> <td colspan="2" style="border:none; width:3em; height:1em;"></td> <td colspan="2" style="border:none; width:3em; height:1em;"></td> <td style="border:none; border-right:1px solid black; width:1.5em; height:1em;" colspan="2"></td> <td style="border:none; width:1.5em; height:1em;"></td> <td colspan="2" style="border:none; width:3em; height:1em;"></td> <td colspan="2" style="border:none; width:3em; height:1em;"></td> <td style="border:none; width:1.5em; height:1em;"></td> </tr> <tr style="text-align:center;"> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" style="border:none; border-right:1px solid black; width:1.5em; height:2em;"></td> <td rowspan="2" style="border:none; width:1.5em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> </tr> <tr style="text-align:center;"> </tr> <tr style="text-align:center;"> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" style="border:none; width:1.5em; height:2em;"></td> <td rowspan="2" colspan="7" style="border:1px solid black; padding:0.2em; width:12em; height:2em; font-size:95%; background-color:#F7F7F7;">Mellario</td> <td colspan="2" style="border:none; border-bottom:3px double black; width:3em; height:1em;"></td> <td rowspan="2" colspan="8" style="border:1px solid black; padding:0.2em; width:12em; height:2em; font-size:95%; background-color:#F7F7F7;">Doran Nymeros Martell</td> <td rowspan="2" style="border:none; width:1.5em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> </tr> <tr style="text-align:center;"> <td style="border:none; border-right:1px solid black; width:1.5em; height:1em;"></td> <td style="border:none; width:1.5em; height:1em;"></td> </tr> <tr style="text-align:center;"> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td colspan="2" style="border:none; width:3em; height:1em;"></td> <td colspan="2" style="border:none; border-bottom:1px solid black; width:3em; height:1em;"></td> <td colspan="2" style="border:none; border-bottom:1px solid black; width:3em; height:1em;"></td> <td colspan="2" style="border:none; border-bottom:1px solid black; width:3em; height:1em;"></td> <td colspan="2" style="border:none; border-bottom:1px solid black; width:3em; height:1em;"></td> <td style="border:none; border-right:1px solid black; border-bottom:1px solid black; width:1.5em; height:1em;"></td> <td style="border:none; border-bottom:1px solid black; width:1.5em; height:1em;"></td> <td style="border:none; border-bottom:1px solid black; width:1.5em; height:1em;"></td> <td style="border:none; border-bottom:1px solid black; width:1.5em; height:1em;"></td> <td colspan="2" style="border:none; border-bottom:1px solid black; width:3em; height:1em;"></td> <td colspan="2" style="border:none; border-bottom:1px solid black; width:3em; height:1em;"></td> <td colspan="2" style="border:none; border-bottom:1px solid black; width:3em; height:1em;"></td> <td colspan="2" style="border:none; border-bottom:1px solid black; width:3em; height:1em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> </tr> <tr style="text-align:center;"> <td colspan="2" style="border:none; border-right:1px solid black; width:3em; height:1em;"></td> <td colspan="2" style="border:none; width:3em; height:1em;"></td> <td colspan="2" style="border:none; width:3em; height:1em;"></td> <td colspan="2" style="border:none; width:3em; height:1em;"></td> <td colspan="2" style="border:none; width:3em; height:1em;"></td> <td style="border:none; width:1.5em; height:1em;"></td> <td style="border:none; border-right:1px solid black; width:1.5em; height:1em;"></td> <td style="border:none; width:1.5em; height:1em;"></td> <td style="border:none; width:1.5em; height:1em;"></td> <td colspan="2" style="border:none; width:3em; height:1em;"></td> <td colspan="2" style="border:none; width:3em; height:1em;"></td> <td colspan="2" style="border:none; width:3em; height:1em;"></td> <td colspan="2" style="border:none; border-right:1px solid black; width:3em; height:1em;"></td> </tr> <tr style="text-align:center;"> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="8" style="border:1px solid black; padding:0.2em; width:12em; height:2em; font-size:95%; background-color:#F7F7F7;">Arianne Nymeros Martell</td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="8" style="border:1px solid black; padding:0.2em; width:12em; height:2em; font-size:95%; background-color:#F7F7F7;">Quentyn Nymeros Martell</td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> <td rowspan="2" colspan="8" style="border:1px solid black; padding:0.2em; width:12em; height:2em; font-size:95%; background-color:#F7F7F7;">Trystane Nymeros Martell</td> <td rowspan="2" colspan="2" style="border:none; width:3em; height:2em;"></td> </tr> <tr style="text-align:center;"> </tr> </tbody></table>
Questo codice appare 'correttamente' in Chrome, nel senso che non mostra anomalie evidenti. Permane il problema in FF. C'é qualche problema con il tool che genera il tree, o é stato trovato un caso non riproducibile tramite questo meccanismo?
La "fonte" del codice si trova qui.
La soluzione che hai trovato tu consiste nel mettere semplicemente vicini due oggetti con colspan dispari, per questo apparentemente funziona, anche se al prezzo di avere celle di dimensione diversa.
Però non mi pare risolva il problema di fondo.
Adesso provo a capire cosa succede eliminando tutte le celle vuote con colspan=2 e mettendo al loro posto celle con colspan singolo. Se funziona, dovremo esagerare con i parametri nel template ma almeno avremo una soluzione... anche se il problema resterebbe tutto.
La "fonte" del codice si trova qui.
La soluzione che hai trovato tu consiste nel mettere semplicemente vicini due oggetti con colspan dispari, per questo apparentemente funziona, anche se al prezzo di avere celle di dimensione diversa.
Però non mi pare risolva il problema di fondo.
Adesso provo a capire cosa succede eliminando tutte le celle vuote con colspan=2 e mettendo al loro posto celle con colspan singolo. Se funziona, dovremo esagerare con i parametri nel template ma almeno avremo una soluzione... anche se il problema resterebbe tutto.
Non era intesa come soluzione, ma come contributo per cercare di individuare la causa del problema " />
Con Explorer non ci sono problemi. Possibile che dipenda da qualche carattere non supportato dagli altri browser?
Explorer secondo me è uno dei browser peggiori al mondo, che mal riproduce html e stile (che sia in un file css o incorporato nell'html), nonchè pessimo a livello di sicurezza.
Per quanto riguarda la questione caratteri, probabilmente è IE a non supportare determinati caratteri rispetto a tutti gli altri browser.
Per quanto riguarda i browser, qualcuno può controllare anche con opera?
Firefox, chromium (chrome), midori e safari sono "coperti".
Firefox non è niente di che come velocità. Chrome ha falle nella sicurezza tranquillamente confrontabili con quelle di Explorer (se non peggiori, la mia ragazza ha rinunciato ad usarlo). E gli altri hanno una diffusione piuttosto bassa.
Non è tanto questione di livello di sicurezza ma di quantità di utenti. Al crescere del numero di utenti diviene interessante da attaccare e saltano fuori le falle.
Con Explorer non ci sono problemi. Possibile che dipenda da qualche carattere non supportato dagli altri browser?
Explorer secondo me è uno dei browser peggiori al mondo, che mal riproduce html e stile (che sia in un file css o incorporato nell'html), nonchè pessimo a livello di sicurezza.
Per quanto riguarda la questione caratteri, probabilmente è IE a non supportare determinati caratteri rispetto a tutti gli altri browser.
Per quanto riguarda i browser, qualcuno può controllare anche con opera?
Firefox, chromium (chrome), midori e safari sono "coperti".
Firefox non è niente di che come velocità. Chrome ha falle nella sicurezza tranquillamente confrontabili con quelle di Explorer (se non peggiori, la mia ragazza ha rinunciato ad usarlo). E gli altri hanno una diffusione piuttosto bassa.
Non è tanto questione di livello di sicurezza ma di quantità di utenti. Al crescere del numero di utenti diviene interessante da attaccare e saltano fuori le falle.
Non mi pare di aver mai parlato di velocità, anche perchè, come sicuramente sai, per quanto riguarda la visualizzazione corretta di html e css la velocità dei browser c'entra ben poco... Quindi perchè la metti in mezzo?
Chrome avrà pure falle di sicurezza confrontabili con quelle di IE, la differenza sta nella volontà di tappare queste falle (volontà spesso assente da parte dello staff di IE) e nella rapidità nel tapparle (le patch di Microsoft fin troppo spesso arrivano troppo tardi).
Chrome/Chromium 2, IE 0, palla al centro (ed io non uso chromium, nè ne sono un fanboy di google o di chromium, lo tengo installato nel mio pc solo per questioni di differente visualizzazione del mio sito).
Per quanto riguarda la diffusione dei browser, le cosiddette browser wars, chrome ha superato ie per svariati motivi, tra cui proprio la sicurezza.
Midori, per quanto poco diffuso, passa l'acid test 3 e quindi è mille volte più compliant, e dunque attendibile, di IE8 (che ha ancora il suo buon 8% di utenti).
Safari non lo uso, ovviamente, ma l'ho incluso nella lista più che altro per gli utenti mac, per capire se la visualizzazione della tabella in questione è corretta su tutte le piattaforme.
Per concludere, fermo restando il fatto che il problema principale del pc a livello di sicurezza è posto tra scrivania e sedia, non si può fornire ad un utente inesperto un prodotto scadente ed insicuro quale è IE.
Tornando alla questione di partenza, è dimostrato e risaputo che IE è pessimo nella corretta visualizzazione di html e css per gravi carenze, quindi è buona norma di un webmaster assicurarsi che la visualizzazione del proprio sito avvenga correttamente sul maggior numero di browser possibile, anche nel rispetto di utenti che usano piattaforme diverse e browser diversi. Se alla fine è soltanto IE a visualizzare male un sito, la colpa non è della progettazione del sito, bensì della progettazione di IE, il peggiore tra i browser di cui abbiamo parlato finora.
Vabbè, sei pienamente assorbito nella browser war " />
Comunque quella pagina è correttamente visualizzata dal terribile IE e non da firefox ed altri.
Vabbè, sei pienamente assorbito nella browser war " />
Comunque quella pagina è correttamente visualizzata dal terribile IE e non da firefox ed altri.
A me della browser war poco frega, sei tu che hai messo in mezzo questioni di velocità senza alcun motivo e hai praticamente negato l'utilità di controllare un sito con browser differenti (pratica invece utilissima ed in uno presso tutti i webmaster seri, non a caso Beric sta testando l'albero genealogico con diversi browser).
Sei contento di IE? Ti fa vedere bene tabelle e tabelline? A parte il che la cosa non implica automaticamente che IE sia un buon browser, se ti trovi bene con IE buon per te, continua ad utilizzarlo, nessuno vuole "evangelizzarti" (ohohoh), ma per negare l'innegabile (ovvero che IE sia pessimo) ci vuole coraggio...
Buona navigazione
Dai, pensate ad aiutare il povero Beric nel suo problema, invece che dibattere sul browser migliore.
Secondo me inserire dei div dentro i td potrebbe aiutare nel problema di visualizzazione di Safari/Chrome, stasera faccio una prova in tal senso...