Tabellenzeile ganz ausblenden

[Delfried]

Tag,
ich versuche mir gerade ein eigenes CSS fürs Forum zu basteln, stehe aber vor folgendem Problem:
Ich würde gerade die Tabellenzeile ausblenden, in der das Bild "10 Jahre Forum" ist und der Text SELFHTML Forum. Wie kann ich das erreichen?
Und darf ich das überhaupt?
Gruß, Delfried

[Kai345]

[latex]Mae  govannen![/latex]

ich versuche mir gerade ein eigenes CSS fürs Forum zu basteln, stehe aber vor folgendem Problem:
Ich würde gerade die Tabellenzeile ausblenden, in der das Bild "10 Jahre Forum" ist und der Text SELFHTML Forum. Wie kann ich das erreichen?

Beachte: In der zweiten genannten Zelle stehen in der Beitrag-Ansicht Autor und Betreff.

Cü,

Kai

[Delfried]

Da steht bei mir nur:
"Das Forum zu SELFHTML
SELFHTML Forum"
Oder meintest du dies? Also dürfte ich dies nciht ausblenden?

Gleich noch ne weitere Frage:
Wie kann ich dem Link "Neue Nachricht verfassen" eigene Stylesheets geben, welche aber nur für ihn gelten. Ich möchte ihm nämlich eine "position: fixed" und so geben, das dieser Link wo ganz anders steht. Wenn ich ihn mit Firebug eigene Stylesheets gebe, dann wird für in in die CSS-Datei kein eigener "Eintrag" geschrieben, was mich ja auch nicht wundert, weil im Quelltext ja auch keine Klasse oder ID für den Link zugeteilt ist. Nur wie kann ich diesem Link trozdem Stylesheets geben?

Gruß, Delfired

[Kai345]

[latex]Mae  govannen![/latex]

Da steht bei mir nur:
"Das Forum zu SELFHTML
SELFHTML Forum"
Oder meintest du dies? Also dürfte ich dies nciht ausblenden?

Doch, natürlich darfst du alles ein-/ausblenden, umpositionieren und was weiß ich alles; was auch immer dir gefällt. Das „Problem“ ist, daß einige Zellen mit der gleichen ID je nach gerade gewählter Ansicht unterschiedliche Inhalte haben können. Was du davon brauchst, weißt natürlich nur du :D Es gibt nur eine Möglichkeit, das zu testen: Blende ihn einfach aus und schau in den verschiedenen Ansichten, wie es sich auswirkt.

Gleich noch ne weitere Frage:
Wie kann ich dem Link "Neue Nachricht verfassen" eigene Stylesheets geben, welche aber nur für ihn gelten. Ich möchte ihm nämlich eine "position: fixed" und so geben, das dieser Link wo ganz anders steht. Wenn ich ihn mit Firebug eigene Stylesheets gebe, dann wird für in in die CSS-Datei kein eigener "Eintrag" geschrieben, was mich ja auch nicht wundert, weil im Quelltext ja auch keine Klasse oder ID für den Link zugeteilt ist. Nur wie kann ich diesem Link trozdem Stylesheets geben?

Der Link kann doch mit #link-neuenachricht bzw #link-neuenachricht a eindeutig angesprochen werden, oder?

Cü,

Kai

[Delfried]

Jetzt weiß ich aber immernoch nicht mit welchem "CSS-Befehl" ich die Höhe von dieser Tabellenzeile auf 0px setzen und zwar so, dass es auch klappt.
Mit overflow und height hat es nicht geklappt, wobei vlt. habe ich da etw. falsch gemacht.
Das was du mir vorher gesagt hast, hat dafür wunderbar geklappt :) Jetzt scrollt mein "Neue Nachricht Button" immer schön mit :) Vielen Dank.
Gruß, Delfried

[Tim Tepaße]

Hallo,

Ich würde gerade die Tabellenzeile ausblenden, in der das Bild "10 Jahre Forum" ist und der Text SELFHTML Forum. Wie kann ich das erreichen?

Erstmal in den Quellcode des Forums gucken:

~~~html <table id="kopf">
  <tr>
  <td id="kopf-logo"><img src="http://src.selfhtml.org/logo.gif" width="106" height="109" alt="SELFHTML" /></td>
  <td id="kopf-titel">
  <p>Das Forum zu SELFHTML</p>
  <h1>SELFHTML Forum</h1>
  </td>
  </tr>
  <td>
  <!-- Weitere Tabellenzeilen mit Inhalt folgen -->

  
Du willst also nur die erste Zeile ausblenden. Dummerweise hat diese keine praktische ID wie viele andere Elemente im Forumsquelltext. Aber für das erste Kindelement eines anderen Elementes gibt es die Pseudoklasse [:first-child](http://de.selfhtml.org/css/eigenschaften/pseudoformate.htm#first_line_letter_child), das an dieser Stelle in SELFHTML sicherlich blöd untergebracht ist. CSS 3 definiert noch haufenweise andere sogenannter [struktureller Pseudoklassen](http://www.w3.org/TR/css3-selectors/#structural-pseudos) mit denen man das Selektieren von Elementen besser eingrenzen kann. Angewendet sieht das dann so aus:  
  
  ~~~css
#kopf tr:first-child {  
      display:none;  
  }

Lies: Für alle ersten Tabellenzeilen unterhalb des Elementes mit der ID "kopf", wende die Deklaration "display:none;" an.

Das gilt übrigens für alle ersten Tabellenzeilen innerhalb der Tabelle #kopf. D.h. wenn die große Kopftabelle weitere Untertabellen enthielte – sie tut es nicht – würden auch die angenommenen ersten Tabellenzeilen dieser angenommenen Untertabellen ausgeblendet. Wenn man wirklich genau nur diese eine Tabellenzelle nehmen will und auf alle hypothetischen Fälle vorbereiten will, dann empfiehlt es sich, nicht den generellen Nachfahren-Selektor zu nehmen, der für alle Nachfahren gilt, egal wie verschachtelt, sondern den direkten Kindselektor (">"):

#kopf > tbody > tr:first-child

Zwischen dem table-Element und dessen Tabellenzeilen liegt immer ein Tbody-Element, auch wenn es nicht im Quellcode notiert wurde. Die tatsächliche Struktur innerhalb des Browsers ist also eher:

table
  └─tbody
    └─tr

Nachzuprüfen ist das z.B. mit Firefox' DOM Inspector oder Safaris Web Inspector. Übrigens kann eine Tabelle auch mehrere tbody-Elemente beinhalten; wenn man also wirklich, wirklich ganz korrekt sein will, wäre die korrekte Variante so:

#kopf > tbody:first-child > tr:first-child

On this road lied madness. Nicht dass diesen Anwendungsfall relevant wäre, natürlich. Die first-child-Pseudoklasse und der Kindsselektor funktionieren übrigens nur in modernen Browsern; für ein Userstylesheet ist das natürlich eher irrelevant, es sei denn man heisst Martin. ;)

Nebenbei: Ich hab bei der großen Kopftabelle die Erfahrung gemacht, dass diese eher doof anzupassen ist, wenn diese im Tabellenlayoutmodell gerendert wird, z.B. wenn man nur eine Tabellenzelle ausblenden will. Praktischer fand ich es, alle tabellenspezifischen Elemente der Kopftabelle mit display:block in Blockelemente zu verwandeln und dann auf Fall-für-Fall-Basis auszublenden oder spezifisch zu formatieren. Wobei einem auch da die Struktur in den Weg kommen kann.

Einen Hauch weiter unten gibt es übrigens einen Thread, in dem verschiedene vorhandene Userstylesheets verlinkt werden. Gut zu abgucken und inspirieren lassen.

Tim

[Gunnar Bittersmann]

@@Tim Tepaße:

Zwischen dem table-Element und dessen Tabellenzeilen liegt immer ein Tbody-Element, auch wenn es nicht im Quellcode notiert wurde.

Nicht immer, sondern bei HTML (und damit auch bei als 'text/html' verarbeitetem XHTML); nicht jedoch bei XHTML als 'application/xhtml+xml', dort wäre bei

<table>  
  <tr>  
    <td>foo</td>  
  </tr>  
</table>

die Struktur tatsächlich

table
  └─tr
    └─td
      └─#text

und ein Selektor table>tbody>tr griffe ins Leere.

Live long and prosper,
Gunnar