Toon posts:

[HTML/XHTML] Opera eigenaardigheid met tabel in tabel

Pagina: 1
Acties:

Verwijderd

Topicstarter
OK, dit wou ik toch even met jullie delen. Na uren verloren met zoeken het volgende opgemerkt:

CCS:
code:
1
2
3
4
5
.aR
{
    text-align: right;
    background-color: #0000FF;
}


Bedoeling is een rechtse uitlijning voor de tweede kolom.

HTML
code:
1
2
3
4
5
6
7
8
9
10
11
12
<table cellpadding='0' cellspacing='0' width='100%' border=1>
    <tr>
        <td>test</td>
        <td align='right'>
            <table cellpadding='3' cellspacing='0' class='' border=1>
                <tr>
                    <td>123</td>
                </tr>
            </table>
        </td>
    </tr>
</table>


Hier nog geen problemen. Maar als je de tweede td verandert naar:
code:
1
2
3
4
5
6
7
8
9
10
11
12
<table cellpadding='0' cellspacing='0' width='100%' border=1>
    <tr>
        <td>test</td>
        <td class='aR'>
            <table cellpadding='3' cellspacing='0' class='' border=1>
                <tr>
                    <td>123</td>
                </tr>
            </table>
        </td>
    </tr>
</table>


Dan werkt ineens de rechtse uitlijning niet meer. Maar hij neemt wel de blauwe achtergrond van de CSS.

Wanneer je nu de inhoud van de tweede kolom wegneemt en vervangt door gewone tekst dan doet ie het weer correct met rechtse uitlijning EN blauwe achtergrond!

code:
1
2
3
4
5
6
7
<table cellpadding='0' cellspacing='0' width='100%' border=1>
    <tr>
        <td>test</td>
        <td class='aR'>123
        </td>
    </tr>
</table>


Dit met Opera v7.03
Ik weet dat er ondertussen al hogere versies zijn van Opera waar dit in opgelost kan zijn maar dit wou ik toch even kwijt. Hoe er dus rekening mee. Ik heb me dus suf gezocht. Hopelijk jullie niet meer.

  • Berkery
  • Registratie: Februari 2004
  • Laatst online: 07-09-2023
De property text-align heeft alleen betrekking op inline content van een block-level element. Niet op block-level content dus. Al trekt IE zich hier waarschijnlijk weinig van aan :)

Ich kann mit einem Eierlöffel Fledermäuse töten.


  • CH4OS
  • Registratie: April 2002
  • Niet online

CH4OS

It's a kind of magic

HTML:
1
<table cellpadding='3' cellspacing='0' class='' border=1>
Wel een beetje overbodig, om er een class aan te hangen, als je hem toch niet gebruikt...

En om het semantisch te houden, als je iets unieks gebruikt in CSS, dan kan je daar beter id voor nemen... :)

Vraag me trouwens ook af, waarom je een tabel in een tabel wilt, bedoel, dan kan je net zo goed een div of span in de cel van de tabel doen... ;)

Ik weet het trouwens ook niet 100% zeker, maar volgens mij is CSS case-INsensitive, dus hoofdletter gebruik of niet maakt niet uit... ;)

En het is sowieso logisch, dat je iets niet te zien krijgt, als je het niet vult, is met een div en span ook... :) (en dus krijg je alleen de achtergrond te zien...)

Wat heeft XHTML eigenlijk te maken met jouw gegeven code? Ik zie er alleen maar HTML staan namelijk... ;)

[ Voor 15% gewijzigd door CH4OS op 06-09-2004 21:37 ]


  • Little Penguin
  • Registratie: September 2000
  • Laatst online: 08-06-2025
Berkery heeft 100% gelijk, er is een groot verschil tussen de text-align CSS property (eigenschap) t.o.v. de HTML "td align=right".

Als je toch wilt dat de 'inner table' rechts uitlijnt zul je de tabel zelf een float mee moeten geven (float: right)

De CSS wordt dan zoiets als: (geen nieuwe classes geintroduceerd EN niet getest)

code:
1
2
3
4
5
6
7
8
.aR
{
    text-align: right;
    background-color: #0000FF;
}
.aR table {
  float: right;
}


En het is natuurlijk IE weer die een geheel eigen uitleg geeft aan text-align... :r

Verwijderd

Topicstarter
Schot in de roos voor Berkery! Zo zie je maar dat je elke woord van de spec gelezen moet hebben. Als IE er zich nu eens aan zou houden dan had ik nu minder grijs haar :)

Anyway, GT jij hebt ook gelijk en alles wat je aanhaalt wist ik. Betreffende code is een c/p uit een groter geheel natuurlijk met het nodige eruit gestript voor de eenvoud.

Float lijkt mij idd een goeie oplossing. May the force be with you!