Minulla on taulukko:
<table border="0" cellspacing="0" cellpadding="0"> <tr> <td class="kulma"> <img ...kuva(16x16)... > </td> <td class="tayte"> </td> </tr> <tr> <td colspan="2"> ...tekstiä yms... </td> </tr> </table>
ja css-tiedosto:
.kulma { width: 16px; height: 16px; } .tayte { font-size: 10%; height: 16px; background-color: #(vari); }
Mozilla näyttää tuon oiken (vasen yläsolu 16x16 pikseliä), Opera jakaa taulukon yläosan kahtia, ja IE asettaa yläosan korkeudeksi n. 20 pikseliä ja jakaa yläsolut jotakuinkin suhteessa 5:1 tms.
Miten saisin sen näkymään oikein kaikilla selaimilla (eli yläosan korkeus 16 pikseliä ja vasemman yläkulman leveys samaiset 16 pikseliä)?
Kokeilepas laittaa tablelle CSS:llä table-layout: fixed.
Ja nyt kun tuota kokeilin, niin eipä toimikaan Operalla. IE ja Firefox kyllä tottelevat kivasti.
Olga kirjoitti:
Ja nyt kun tuota kokeilin, niin eipä toimikaan Operalla. IE ja Firefox kyllä tottelevat kivasti.
Niin kuin sanoit Operalla mikään ei muuttunut. IE taas asetti kylläkin oikein vasemman yläkulman solun mitat, mutta koko taulukko ja samalla oikeanpuoleinen solu venyivät leveydeltään suunnilleen kolminkertaisiksi.
edit:
Sain sen lopulta toimimaan, kun korvasin tuon colspan-systeemin laittamalla yhden yläsolun sisälle toisen taulukon, joka oli jaettu kahteen osaan, ja käyttämällä siinä "table-layout: fixed;" -määrettä.
Tämä ei vielä riittänyt, vaan IE venytti vasemman yläkulman n. 20 pixeliä leveäksi (korkeus oli oikea). Kun tein kuvasta vähän isomman, niin sekin ongelma hävisi.
Aihe on jo aika vanha, joten et voi enää vastata siihen.