Linuchs: css Vererbung unterbinden

Moin,

ich habe Formulare in Form von <table>, für die ich die Spalten per CSS einrichte.

Innerhalb des Formulars gibt es Felder, die sich während des Tippens Vorschläge per Ajax holen.

Nun blende ich die Vorschläge als <table class="t_ajax"> ein und möchte die Spalten unabhängig von der übergeordneten Tabelle definieren.

Die übergeordnete Tabelle hat z.B. tr>td:nth-of-type(2){text-align:center} und die t_ajax-Tabelle ausdrücklich tr>td:nth-of-type(2){text-align:left!important}, das wird aber ignoriert und vom FF-Inspektor nichtmal angezeigt.

Die übergeordnete Tabelle ist im HTML-Dokument definiert, die t_ajax in der anschließend geladenen basis.css - von daher müssten doch die später definierten Werte auch ohne !important Vorrang haben?

<style>
    table.tp502 tr>td:nth-of-type(2) {  /* Pflichtfeld */
      width: 0.5em;
      text-align: center;
      color: #f00;
      font-size: 120%;
      font-weight: bold;
    }
... 
</style>
<link rel=stylesheet      href="css/basis.css">

Datei basis.css:

/* Tabelle in p502, p504 mit Vorschlagswerten aus ajax_getTreffpunkte.js 2019-03-18 */
table.t_ajax {
  all: initial;
}
table.t_ajax tr>td:nth-of-type(1) {
  text-align: right!important;
}
table.t_ajax tr>td:nth-of-type(3) {
  text-align: left!important;
  color: inherit!important;
}

auch initial setzt die Werte nicht zurück.

Wie kann ich die untergeordnete Tabelle von Vererbung befreien?

Gruß, Linuchs

Edit: Sehe gerade, dass ich type(2) gar nicht überschrieben habe. Aber es kann doch nicht richtig sein, jede vererbte CSS-Angabe einzeln zu überschreiben. Da muss man nur dem parent nachträglich etwas hinzufügen und schon schlägt es durch?

  1. Hallo Linuchs,

    gibt es einen Link zur Seite?

    Bis demnächst
    Matthias

    --
    Pantoffeltierchen haben keine Hobbys.
    ¯\_(ツ)_/¯
    1. Hallo Matthias,

      gibt es einen Link zur Seite?

      In diesem öffentlichen Programm funktioniert's. Gib als Gebäude/Platz mal hof ein.

      In einem anderen Programm für geschlossene Benutzergruppe stimmt das Layout derselben Javascript-Routine aber überhaupt nicht. Deshalb ist es so wichtig, diese Javascript-Routine unabhängig zu machen von dem Programm, in dem sie eingesetzt wird.

      Gruß, Linuchs

  2. Hallo Linuchs,

    Wie kann ich die untergeordnete Tabelle von Vererbung befreien?

    Du meinst nicht Vererbung.

    Vererbung bedeutet zum Beispiel, dass die Schriftart eines Absatzes auf all seine Kindelemente vererbt wird.

    Du willst die Kaskade beeinflussen.

    Bis demnächst
    Matthias

    --
    Pantoffeltierchen haben keine Hobbys.
    ¯\_(ツ)_/¯
    1. Du meinst nicht Vererbung.

      Es wird ja blöderweise so genannt. Mir ist schon klar, dass parent nicht gestorben sein muss, damit child was erbt.

      Du willst die Kaskade beeinflussen.

      Wenn's hilft, gerne.

  3. Hi,

        table.tp502 tr>td:nth-of-type(2) {  /* Pflichtfeld */
    

    Wenn Du nicht den allgemeinen Nachfahren-Selektor haben willst, dann benutze ihn nicht.

    (Beachte dabei aber, daß die tr nicht direkte Kinder von table sind, sondern ein thead, tfoot oder tbody dazwischen steckt.

    cu,
    Andreas a/k/a MudGuard

  4. habe mangels anderer Ideen die untergeordneten Tabellenfelder jetzt mit absolut-Werten belegt, etwa font-size:11pt; es funktioniert.

    Linuchs