Daniel (nun registriert): Diverse kleine CSS / DIV Probleme

SELF-Forum

Diverse kleine CSS / DIV Probleme

Daniel (nun registriert)
– Informationen zu den Bewertungsregeln

Hallo,
es geht um folgende Seite:
http://agh653.ag.funpic.de/reduced.htm

Eins vorweg, falls es jmd. so nicht bekannt sein sollte: Layer = <div>...</div>

Folgende Probleme habe ich:

  1. Unterschied Firefox und Internet Explorer:
  • Im Firefox habe ich bei Bildern, die sich innerhalb eines Layers befinden, unter den Bildern immer einen Leerraum:

    Links der Internet Explorer, rechts der Firefox (so wie es im IE dargestellt wird, soll es auch im Firefox ausschaun)

Dieser unschöne Leerraum ist auch beim Anklicken des Bildes im Firefox (ist ein Link mit Bild als Linkbeschreibung) sichtbar (Layer Rahmen entfernt, um das Ganze aufs wesentliche zu reduzieren)

Dieser Effekt muss irgendwie von den Layern kommen, denn ohne Layer tritt dieses Problem nicht auf:
a) Link ohne Layer (Problem tritt nicht auf): http://agh653.ag.funpic.de/link_ohne_layer.htm
b) Ein Link ohne Layer und ein Link mit Layer (das obere Bild ist ohne Layer): http://agh653.ag.funpic.de/link_mit_layer.htm

  1. "Dieser Text soll nicht wie jetzt oben rechtes vom Bild sein, sondern unten rechts"
    Der Text sagt es ja schon selbst, er soll am Ende grob (darf ruhig so weit unten wie das untere ende des Bildes sitzen, wird dann einfach mit margin-bottom oder padding-bottom wieder "hochgesetzt") so sitzen:

Mit ner Tabelle wäre das ja ganz einfach (vertical-align: bottom), aber kann ich das auch mit Layern umsetzen?

Vielen Dank schonmal für eure Hilfe und noch n schönes (Rest) Wochenende:-)

Beitrag melden
–
Informationen zu den Bewertungsregeln

  1. Diverse kleine CSS / DIV Probleme

    Orlando
    – Informationen zu den Bewertungsregeln

    Dieser unschöne Leerraum ist auch beim Anklicken des Bildes im Firefox (ist ein Link mit Bild als Linkbeschreibung) sichtbar (Layer Rahmen entfernt, um das Ganze aufs wesentliche zu reduzieren)

    Siehe Images, Tables, and Mysterious Gaps (deutsche Übersetzung)

    1. "Dieser Text soll nicht wie jetzt oben rechtes vom Bild sein, sondern unten rechts" […]
      Mit ner Tabelle wäre das ja ganz einfach (vertical-align: bottom), aber kann ich das auch mit Layern umsetzen?

    vertical-align funktioniert, wenn das Element mittels display:table-cell formatiert wurde. AFAIR macht der IE da nicht mit, also bleibt nur die Möglichkeit, mit margin-/padding-top oder einem Workaround mit line-height zu arbeiten.

    Ausgezeichnete Fehlerbeschreibung übrigens, Kompliment.

    Roland

    --
    Noch 5 Tage bis zur Glückseeligkeit.
    priv • off • bla • ha
    Beitrag melden
    –
    Informationen zu den Bewertungsregeln

    1. Diverse kleine CSS / DIV Probleme

      Daniel (nun registriert)
      – Informationen zu den Bewertungsregeln

      Vielen Dank für deine Antwort, das Problem mit dem Rahmen um die Grafik konnte ich dank deinem Link schonmal lösen.

      Hierzu habe ich allerdings noch eine Frage:
      Bei mir funktioniert sowohl die Angabe von HTML 4.01 Transitional mit URL, also:
      <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
      als auch eben display:block für das Bild.
      Im Artikel steht nun, man solle einen Transitional Doctype ohne URL angeben? Aber gerade die URL definiert doch den Standard?

      Bleibt aber noch das Problem mit der Ausrichtung des Textes, ich weiß ja nicht, wie groß der am Ende wird und zudem will ich ihn ja nicht vertikal zentrieren, sondern nach unten setzen (vertical-align: bottom).
      Ich fürchte, da bleibt mir dann wohl doch nichts anderes als die Nutzung von Tabellen?

      Beitrag melden
      –
      Informationen zu den Bewertungsregeln