Theming: Elemente ohne sichtbaren Inhalt entfernen

Da Du in Deinem Bild genau da aufgehört hast, wo es dann interessant würde, kann man Dir das kaum beantworten.

Beste Grüße
Werner

ich hab's zwar das Bild nochmal vergrößert, aber man kann es selber am Standardtheme sowie vielen anderen Themes mit dem firebug sehen ....

dachte, dass es vllt. noch jemanden aufgefallen ist und es als störend empfindet^^

Was sagen denn die CSS-Anweisungen für die diversen Ebenen? Der Aufbau ist, soweit ich das sehe, für Drupal 7 normal und ohne Besonderheiten. Du wirst Dich daran gewöhnen müssen, daß ein CMS mehr Code produziert, als Du von Hand bauen würdest. Die Zwischenboxen dienen als Klammern (wenn noch weitere Elemente zugefügt werden) oder als Träger von Klassen um das Theming zu erleichtern.
Nimm Dir Firefox mit dem Plugin Firebug und sieh Dir an, welche Margin Einstellungen in irgendeiner der vielen CSS-Dateien Dir nichtgefällt. Die überschreibst Du dann in einem eigenen CSS-File in Deinem Theme. Das ist aber ganz normales Vorgehen und sollte Dir in Fleisch und Blut übergehen. Das ist immer wieder erforderlich.

Beste Grüße
Werner

Könnte ggfs. auch am line-height liegen.

Ich nutze grundsätzlich firebug, wenn es ums Anpassen geht. Jedoch komme ich hierbei zu keiner Lösung. Um "margin und padding" geht es mir nicht. Wenn ich es auf "0" setze, dann bleibt dennoch ein gewissen Abstand nach unten.

"line-height" hab ich schon probiert ... passiert nix.

Es geht um den unsichtbaren "Balken", der quasi ja die Verlinkung des Thumbnails zum Node darstellt. Das Zwischenabstände vorkommen (z.B. Tags/Quellenangabe usw. unterm Text) ist auch ok, aber bei Bildern brauch ich es absolut nicht. Wenn ich zum Beispiel auf die Seite von Thoor schaue, sind dort diese Abstände unter den Teaserbildchen nicht.

Liegt es vllt. am Standardfeldtyp "Image" von Drupal?

Ich denke auch, dasss der "Balken" ein padding oder margin Abstand ist. Weil Du meine Seite erwähnst, da sind die Node-Vorschauen ja eigens gethemed. Das Bild ist in einem separaten DIV Container und der Anrisstext auch.

Am Besten ist es, wenn Du Deine Seite mal online stellst und nen Link postest. Mit den Screenshots kann niemand was anfangen, da man ja nicht die einzelnen Elemente untersuchen kann!

Entwarnung. Diesen Balken findest du auf sehr vielen Seiten, z.B. hier bei AIGA (rechts unten beim Bild von Alexey Brodovitch). Der Balken hat nichts mit Padding oder Margin zu tun, sondern wird von Firebug angezeigt, wenn das <a>-Elternelement des anklickbaren Images ein Inline-Element ist. Einem Inline-Element kann keine Höhe (außer über line-height) zugewiesen werden, daher zeigt Firebug lediglich einen schmalen Balken, wenn man das Element im Browser analysiert. Dieser Balken hat keinerlei Einfluß auf deine Webseite, auch wenn es bei dir so aussieht, als würde er die Links nach unten schieben. Der Grund für den Abstand der Links zum Bild wird woanders liegen, dazu müsste man die Seite mal online analysieren.

Dass auf Thoors Seite kein Balken angezeigt wird, liegt am gefloateten <img>-Element. Ohne Float erscheint der Balken auch dort. Man könnte dem <a>-Element auch ein display:block zuweisen, aber wie gesagt, es ist nicht notwendig, da dieser Balken lediglich die Art und Weise von Firebug ist, solche Inline-Elemente anzuzeigen.

Ich hab im Moment leider kein Projekt zum Veranschaulichen online, nur auf lokaler Ebene. Ich hab auch noch kein fertiges Theme. Mir ist das schon beim Bartik und Tarski Theme aufgefallen.

aber: @Anton ... Die von dir angegebene Seite verdeutlicht es ganz gut. Wenn man auf das Bild (rechts unten beim Bild von Alexey Brodovitch) geht, sieht man per Firebug das sich das < a >-Elternelement des Bildes nicht über das Bild an sich hinaus bewegt (so wie ich das auch gerne hätte).

Aber schaut euch mal auf der selben Seite rechts außen das Bild mit der Überschift "AIGA Publication" (rotes Pic "do good design") an. Dort geht quasi das < a >-Element des Bildes über das Image hinaus (nach unten), was bei diesem Beispiel vllt. nicht gerade viel ist. Bei mir jedoch verschiebt sich dieses Element bei mir noch weiter nach unten, wenn der Margin-Abstand vergrößert wird.

Hier hast Du auch in der aiga-main.css Zeile 257 die Anweisung:

die den Link und das Image umschliesst, was Dir die 8px beschert ...

Das ist ja auch richtig so, bei einem margin-bottom wandert der Balken nach unten. Siehe auch die DrupalCon-London-Werbung links oben auf dieser Seite. Erhöhe da mal per Firebug den margin-bottom von 5px auf 50px und der Balken wandert weit aus dem Bild raus (nämlich besagte 50px)... Aber wie gesagt, der Balken nimmt auf deiner Webseite keinerlei Platz in Anspruch, er ist lediglich eine Firebug-interne Markierung eines Elementes.

Wenn du auf deiner Seite also unterhalb des ESEA-Bildes weniger Raum haben willst, musst du einfach nur den margin-bottom des dazugehörenden <img>-Elementes verringern.