Marc: Positionierung eines Bildes und Hintergrund

Hallo!

Mir ist es fast peinlich wegen so einer Kleinigkeit hier zu fragen, aber ich stehe im Moment sowas von aufm Schlauch, mir faellt beim besten Willen keine Loesung ein.

Folgendes Problem: Auf der verlinkten Seite soll das Dummyfoto links neben dem Text stehen. Der Text soll am oberen Rand des Kastens anfangen und der Hintergrund soll sowohl den Text als auch das Bild vollstaendig umschliessen.
Das tut er bei mir leider nicht.

Koennt ihr mir da mal aus der Patsche helfen und meinen Denkknoten loesen?

Vielen Dank und herzliche Gruesse,
Marc

  1. hi,

    Folgendes Problem: Auf der verlinkten Seite soll das Dummyfoto links neben dem Text stehen. Der Text soll am oberen Rand des Kastens anfangen und der Hintergrund soll sowohl den Text als auch das Bild vollstaendig umschliessen.
    Das tut er bei mir leider nicht.

    beschäftige dich mal mit der css-eigenschaft float, http://selfhtml.teamone.de/css/eigenschaften/positionierung.htm#float.

    gruss,
    wahsaga

    1. Hallo,

      ich weiss schon, dass das mit float geht. Hab ich auf der Test-Seite jetzt beim ersten DIV auch mal gemacht.
      Das aendert aber nichts daran, dass die Hintergrundfarbe das Bild nicht umschliesst.
      Wie erreiche ich das denn?

      Gruesse,
      Marc

  2. Hallo,

    ich habe die Style-Angabe für die Klasse aktuelles etwas modifiziert:

    .aktuelles {background-color:#AAAAAA;
                padding:3px;
                padding-bottom: 10px; /* neu */
                clear:both            /* neu */
        }

    Das schaut zumindest im IE 6.0 gut aus.

    Viele Grüße
    Frank

  3. Hallo,

    <img src="grafik.png" alt="" border="0" height="150" width="200" style="float:right;" />

    <p>Text 1</p>

    <p style="clear:right;">Text 2</p>

    Mit float erreichst Du eine Ausrichtung des Bildes, hier rechtsbündig, bei dem der Text 1 um das Bild fließt.

    Text 2 jedoch wird nicht mehr um das Bild fließen, da mit clear die Rechtsbündigkeit aufgehoben wird.

    Du musst natürlich left statt right nehmen.

    Heiner

  4. Tach!

    Ich erschiess mich!
    Ich hab jetzt gebastelt und gebastelt und bin nebenbei mal auf die Idee gekommen nen ordentlichen Browser zu benutzen (Phoenix).

    Nach nur zwei Minuten sahs so aus wie ich es wollte. Nur im IE nicht. Nach weiteren 5 Minuten sahs im IE fast (!!) so aus wie ich wollte und das Ergebnis in Phoenix war vertretbar.
    Dieses Ergbenis gibts unter dem Link.

    Frage: Warum stellt der IE den Text nicht mehr dar? Und warum stellt er ihn dar, wenn man ihn einmal markiert hat? Will der mich verar....?

    Anregungen oder Vorschlaege?

    Viele Gruesse,
    Marc

    1. Hi,

      nimm mal das <br style="clear:both;"> raus...
      schätze, damit bringst du den ie durcheinander, da ja kein float definiert wurde. was du stattdessen nehmen solltest wäre <br clear="left">. du bringst da html und css etwas durcheinander..;-)

      freundliche Grüße
      Ingo

      1. Moin!

        Und weiter gehts. Hab deine Tipps befolgt, leider keine Besserung (siehe Link).
        Dort hab ich im ersten Kasten nun stehen <br clear="left"><br>
        Damit ist zwar der Kasten so gross wie er soll (im IE), aber der IE zeigt keinen Text.
        Der zweite Kasten hat nur ein <br style="clear:both;">, in Phoenix ists auch wie gewollt, der IE macht den Kasten aber kleiner als die Grafik.

        Sobald ich nach dem <br clear="left"> irgendwas hinsetze (ein <br> oder Text), verschwindet der Text, der davor definiert worden ist (im IE).

        Kann mir das bitte jemand erklaeren, ich verzweifel hier noch! :-)

        Gruesse,
        Marc