MICHI: Ein Bild in einem div-Bereich

Hi!

Ich heul gleich. *seufz* Folgendes Problem :

Ich mach eine Seite mit einem gelben div-Bereich :

<html>
<head>
</head>
<body style=" background-color:black ">
<div style=" width:800px; height:300px; background-color:yellow; ">
</div>
</body>
</html>

OK, klappt wunderbar. Und jetzt möchte ich in diesen div-Bereich ein 500*300 großes Bild einfügen. Ich füge also zwischen <div> und </div> folgendes ein :

<img src="bild.gif" width="500px" height="300px" alt="" border="0">

Jetzt müßte es, da ja das Bild so hoch ist wie der div-Bereich so sein, daß das Bild oben, links und unten genau im gelben Bereich ist und rechts vom Bild die restlichen 300px des div-Berichs leer ( also gelb ) bleiben.

Dem ist aber nicht so. =(

Oben und links schließt es schön ab und unter dem Bild bleibt ein 2 oder 3px hoher gelber Rest.

Ich hab jetzt wirklich schon alle Kombinationen mit padding, bottom, margin-bottom, etc durchprobiert. Ich kann machen, was ich will, jedes mal bleibt dieser dünne Bereich unter dem Bild gelb. Selbst, wenn ich die Höhe des div-Bereichs auf z.B. 100 einstelle, macht er sich selbständig so hoch wie der Inhalt. ( Das ist eh logisch ) aber selbst DANN bleibt ein 2-3px hoher gelber Bereich unter dem Bild.

WO bitte liegt mein (Denk)Fehler? Das gibt`s doch nicht!

Wie muß ich den code schreiben, damit ich mein erwünschtes Ergebnis erreiche?

DANKE !!!

MICHI =)

  1. Hi,

    Jetzt müßte es, da ja das Bild so hoch ist wie der div-Bereich so sein, daß das Bild oben, links und unten genau im gelben Bereich ist und rechts vom Bild die restlichen 300px des div-Berichs leer ( also gelb ) bleiben.
    Dem ist aber nicht so. =(
    Oben und links schließt es schön ab und unter dem Bild bleibt ein 2 oder 3px hoher gelber Rest.

    Wie oft muß das hier eigentlich noch gesagt werden, daß Bilder standardmäßig auf der base-line der Schrift vertikal ausgerichtet werden - unter dieser ist Platz für die Unterlängen.
    Setze also die vertikale Ausrichtung für das Bild entsprechend Deinen Wünschen.

    cu,
    Andreas

    --
    Der Optimist: Das Glas  ist halbvoll.  - Der Pessimist: Das Glas ist halbleer. - Der Ingenieur: Das Glas ist doppelt so groß wie nötig.
    http://mud-guard.de/? http://www.andreas-waechter.de/ http://www.helpers.de/
    1. Wie oft muß das hier eigentlich noch gesagt werden, daß Bilder standardmäßig auf der base-line der Schrift vertikal ausgerichtet werden - unter dieser ist Platz für die Unterlängen.
      Setze also die vertikale Ausrichtung für das Bild entsprechend Deinen Wünschen.

      cu,
      Andreas

      Ich bin nun mal noch nicht perfekt und bei der massigen Anzahl der selfhtml-Seiten kanns halt sein, daß so jemand wie ich nicht die richtige Lösung findet.

      Anstatt mich also so oberlehrerhaft zurechtzuweisen wäre es mir eine bessere Hilfe, mir die entsprechende style-Anweisung zu sagen und wo sie hingehört. Mit Deiner Antwort kann ich nämlich NICHTS anfangen. =(

      1. Hallo,

        Mit Deiner Antwort kann ich nämlich NICHTS anfangen. =(

        Im Posting von Andreas kommt das Wort base-line vor. Ich denke mit diesem Wort und der Forumsuche kann man was anfangen!

        Viennamade

      2. hi,

        Anstatt mich also so oberlehrerhaft zurechtzuweisen wäre es mir eine bessere Hilfe, mir die entsprechende style-Anweisung zu sagen und wo sie hingehört. Mit Deiner Antwort kann ich nämlich NICHTS anfangen. =(

        das ist bedauerlich, und zeigt, dass du dir kaum mühe gibst.

        wie schwer ist es, selfhtml aufzurufen, und dort dann wie folgt zu navigieren:
        CSS
        CSS-Eigenschaften
        Ausrichtung und Absatzkontrolle
        vertical-align (Vertikale Ausrichtung)
        ?

        uff, jetzt haben wir uns aber überanstrengt, was?

        gruss,
        wahsaga

      3. N'Obend!

        Anstatt mich also so oberlehrerhaft zurechtzuweisen wäre es mir eine bessere Hilfe, mir die entsprechende style-Anweisung zu sagen und wo sie hingehört. Mit Deiner Antwort kann ich nämlich NICHTS anfangen. =(

        Folgende Antwort ist hier im Forum verpönt:
        <img src="schwafel.bla" style="verical-align:middle">

        Denn: Das Ding hier heist SELFforum, was du hier findest ist Hilfe zur Selbsthilfe. Wenn man dir hier nur die entsprechende Zeile hinklatscht hast du daraus nix gelernt. Alles nur zu deinem Besten ;)

        n8,
        dbenzhuser

        1. Hallo dbenzhuser,

          Folgende Antwort ist hier im Forum verpönt:
          <img src="schwafel.bla" style="verical-align:middle">

          Bei mir, weil ein Flüchtigkeitsfehler drin steckt. Es heißt vertical-align. ;-)

          Tim

          --
          [x] Für die Einführung des Themenbereiches »Python«
          1. Moin Tim

            Folgende Antwort ist hier im Forum verpönt:
            <img src="schwafel.bla" style="verical-align:middle">

            Bei mir, weil ein Flüchtigkeitsfehler drin steckt. Es heißt vertical-align. ;-)

            Mir ist die Tastatur runtergefallen und da sind Tasten abgebrochen und das "Te" ist jetzt kapput und...

            Das ist natürlich peinlich...
            Ich stell mich 2 Minuten in die Ecke.

            dbenzhuser