gothmod: Hilfestellung für einen Anfänger? Bild und Text

Hi Leute,

ich krieg da was nicht hin.

ich habe mir folgendes vorgestellt:

ich möchte das neben ein bild ein text steht.
der Text klebt aber leider immer am unteren rechten Rand des bildes, wenn nun
ein weiteres bild drunter kommt verschiebt dieses sich beim auto-umbruch des textes.
Ich habe diesen Code generiert.

in der Css Datei is das das DIV id="Content":

#content {
   margin-left:260px;
   margin-right:15px;
   padding:25px;
   top:50px;
   background-color:#fff;
   }
hier habe ich schon versucht mit "float" und "vertical-center" zu arbeiten,Leider hat es auf diese box bei diesem html Tag:

<div id="content">
         <h1>Willkommen in der Bildergalarie von gothmod</h1>

<a href="memberliste.html"><p>hier unsere Mitglieder</p>
        <img src="images/pwna.jpg" heigt="250px" width="250px" border="0"/>
        </a>

keinerlei wirkung????
Wie löst man das elegnat?

  1. Hallo,

    wenn ich das richtig interpretiere baust Du eine DIV-Kiste, darin ist ein link in dem ein Bild und Text ist. Du willst das das Text neben und nicht unter dem Bild steht. Richtig?

    Nun, mein Minitest:

      
    <div> <a href=''> <img src='y:\\birne6.png'> Ne hole birne</a><div> 
    

    Zeigt mir das es das auch im Normalfall tut.
    Ich vermute mal durch Deine großen http://de.selfhtml.org/css/eigenschaften/randabstand.htm@title=margin und Paddingwerte hast Du einfach nur riesige Ränder geschaffen. Der inner Platz reichte nun warscheinlich nicht mehr aus. Also fing der Browser an umzubrechen. Nimm also mal die margin-Werte weg und exerimentiere mit dem http://de.selfhtml.org/css/eigenschaften/positionierung.htm#width@title=width-Wert. das sollte bessere Ergebnisse liefern.

    Hoffe ich habs richtig verstanden.

    Viele Grüße,
    Rob

    1. Hallo,

      wenn ich das richtig interpretiere baust Du eine DIV-Kiste, darin ist ein link in dem ein Bild und Text ist. Du willst das das Text neben und nicht unter dem Bild steht. Richtig?

      Nun, mein Minitest:

      <div> <a href=''> <img src='y:\birne6.png'> Ne hole birne</a><div>

      
      >   
      > Zeigt mir das es das auch im Normalfall tut.  
      > Ich vermute mal durch Deine großen <http://de.selfhtml.org/css/eigenschaften/randabstand.htm@title=margin> und Paddingwerte hast Du einfach nur riesige Ränder geschaffen. Der inner Platz reichte nun warscheinlich nicht mehr aus. Also fing der Browser an umzubrechen. Nimm also mal die margin-Werte weg und exerimentiere mit dem <http://de.selfhtml.org/css/eigenschaften/positionierung.htm#width@title=width>-Wert. das sollte bessere Ergebnisse liefern.  
      >   
      >   
      > Hoffe ich habs richtig verstanden.  
      >   
      > Viele Grüße,  
      > Rob  
        
      Hallo Rob,  
        
      Danke für die Antwort. ich weis leider noch nit wir ich manche sachen fachlich richtig ausdrücke. Das mit dem div stimmt (BOX)  
      Hm.. der Text steht schon neben dem Bild das geht schon. allerdings hängt dieser dann direkt an der unteren rechten ecke des Bildes. dieser text soll eigntlch nur nach oben genommen werden. Die breite der Ränder is so eingtlich perfekt. Das ergbnis sieht man hier :  
      www.gothmod.de/members.html  
        
      ich will die bilder alle neu anordnen und eben den text nicht mehr so blöd umbrechen lassen sonder positionieren können. direkt in der mittlerne vertikalen ausrichtung des bildes links davon.  
        
      Thx roland
      
      1. Hallo,

        Danke für die Antwort. ich weis leider noch nit wir ich manche sachen fachlich richtig ausdrücke. Das mit dem div stimmt (BOX)

        ich will die bilder alle neu anordnen und eben den text nicht mehr so blöd umbrechen lassen sonder positionieren können. direkt in der mittlerne vertikalen ausrichtung des bildes links davon.

        Hi, die anderen haben Dich ja schon auf Float hingewiesen. Und das ist auch der Schlüssel.
        Der Trick dabei sit das Float sich auf 'nachfolgende' Objekte bezieht.
        Nach etwas rumspielen hat mein beispiel von oben jetzt auch den Text am oberen rechten Rand:

          
        <div style="width:800px; float:left;"><a href='' > <img src='y:\\birne6.png'></div> ne hole birne</a>  
        
        

        Was aber wie ich mir vorstellen kann nicht der Weißheit letzes Schluss ist, da das <div> den link <a> durchbricht. Was ich persönlich jetzt nicht so schön finde.

        Viele Grüße,
        Rob

        1. Hallo,

          Danke für die Antwort. ich weis leider noch nit wir ich manche sachen fachlich richtig ausdrücke. Das mit dem div stimmt (BOX)

          ich will die bilder alle neu anordnen und eben den text nicht mehr so blöd umbrechen lassen sonder positionieren können. direkt in der mittlerne vertikalen ausrichtung des bildes links davon.

          Hi, die anderen haben Dich ja schon auf Float hingewiesen. Und das ist auch der Schlüssel.
          Der Trick dabei sit das Float sich auf 'nachfolgende' Objekte bezieht.
          Nach etwas rumspielen hat mein beispiel von oben jetzt auch den Text am oberen rechten Rand:

          <div style="width:800px; float:left;"><a href='' > <img src='y:\birne6.png'></div> ne hole birne</a>

          
          >   
          > Was aber wie ich mir vorstellen kann nicht der Weißheit letzes Schluss ist, da das <div> den link <a> durchbricht. Was ich persönlich jetzt nicht so schön finde.  
          >   
          > Viele Grüße,  
          > Rob  
            
            
          Vielen Dank so klappst perfekt danke schön für deine GEduld mit einem NOOB wie mir so einfach eigentlich. Der Link von dem bild funktioniert auch noch der text läßt sich nun schön innerhalb vonm <P> tag umbrechen ohne das die bilder unten dran gleich beeinflusst werden sehr genial genau so wollt ich es  hinbekommen. THX nochmal ehrlich.
          
          1. Kotáka!

            <div style="width:800px; float:left;"><a href='' > <img src='y:\birne6.png'></div> ne hole birne</a>

            
            > >   
            > > Was aber wie ich mir vorstellen kann nicht der Weißheit letzes Schluss ist, da das <div> den link <a> durchbricht. Was ich persönlich jetzt nicht so schön finde.  
              
            Der Weißheit letzter Schluß ist #fff, aber auch weise ist der obige Code nicht, sondern falsch.  
              
            
            > Vielen Dank so klappst perfekt  
              
            Unter "perfekt" verstehe ich was anderes. Daß die Browser hieraus überhaupt etwas machen, fällt in die Kategorie "Dieses satz grotten falsch du Verstehn trotzdem".  
              
            Die Browser korrigieren das wohl so, daß das div nur noch das img umschließt. In dem Fall ist es überflüssig, weil es ein gruppierendes Element ist und man ein einzelnes Bild nicht zu gruppieren braucht. Der Style, also float:left, kann dann direkt aufs img angewandt werden. Und genau diese Lösung hatten wir schon ...  
              
            Viele Grüße vom Længlich  
            
            -- 
            Mein aktueller Gruß ist:  
            Enga (Papua-Neuguinea)
            
  2. hier habe ich schon versucht mit "float" ... zu arbeiten,

    Wie genau, worauf genau hast du das float angewendet?

    Wie löst man das elegnat?

    Mit float.
    http://de.selfhtml.org/css/eigenschaften/positionierung.htm#float

    1. hier habe ich schon versucht mit "float" ... zu arbeiten,

      Wie genau, worauf genau hast du das float angewendet?

      Wie löst man das elegnat?

      Mit float.
      http://de.selfhtml.org/css/eigenschaften/positionierung.htm#float

      ich hab das float in die css datei reingeschrieben.
      Siehe so:

      #content {
         margin-left:260px;
         margin-right:15px;
         padding:25px;
         top:50px;
         background-color:#fff;
         span: vertical-align;
         text:float;
         }

      thx Gothmod

      1. Daa daa oo!

        text:float;

        Gehe zurück zu http://de.selfhtml.org/css/eigenschaften/positionierung.htm#float. Gehe nicht über Los. Ziehe nicht DM 4000 ein.

        Viele Grüße vom Længlich

        --
        Mein aktueller Gruß ist:
        Fante (Ghana, Burkina Faso)
        1. Daa daa oo!

          text:float;

          Gehe zurück zu http://de.selfhtml.org/css/eigenschaften/positionierung.htm#float. Gehe nicht über Los. Ziehe nicht DM 4000 ein.

          Viele Grüße vom Længlich

          aber genau das checkich eben nicht hmmm... anfänger eben

          is float:left richtig?? weil das hat auch keine auswirkung!!! text klebt immer nach an der unteren rechten ecke des bildes
          keine 4000 schade

          thx

          1. Mingabu!

            is float:left richtig?? weil das hat auch keine auswirkung!!! text klebt immer nach an der unteren rechten ecke des bildes

            Ja, ist richtig. Aber nicht für das Container-Div, sondern für das Element, das umflossen werden soll. Also in Deinem Fall das img.

            Viele Grüße vom Længlich

            --
            Mein aktueller Gruß ist:
            Ga (Ghana)
            1. Mingabu!

              is float:left richtig?? weil das hat auch keine auswirkung!!! text klebt immer nach an der unteren rechten ecke des bildes

              Ja, ist richtig. Aber nicht für das Container-Div, sondern für das Element, das umflossen werden soll. Also in Deinem Fall das img.

              Viele Grüße vom Længlich

              ok das muss ich dannauch probieren , ich habs nun aber in das <p> tag eingebunden und  das geht dann besten weil nicht das bild nach rechts soll sonder der text soll direkt neben an stehen.

              thx thx

  3. Hi,

    bitte mach nicht ständig neue Threads auf, wenn dein Problemchen thematisch noch gut in einen bestehenden reinpasst, bzw. sogar nur die Fortsetzung davon ist.

    Bitte lies nach, warum Doppelpostings hier unerwünscht sind - und beherzige es künftig.

    MfG ChrisB

    --
    RGB is totally confusing - I mean, at least #C0FFEE should be brown, right?
    1. Hi,

      bitte mach nicht ständig neue Threads auf, wenn dein Problemchen thematisch noch gut in einen bestehenden reinpasst, bzw. sogar nur die Fortsetzung davon ist.

      Bitte lies nach, warum Doppelpostings hier unerwünscht sind - und beherzige es künftig.

      MfG ChrisB

      »»

      Ja geht klar ich dachte nur das  es etwas einfacher wird wenn die leute wissen das ich ein anfänger bin, da kommt doch eher verständins dabei raus.

      Trozdem werden ich mich daran halten .

      thx Roland

      1. Ja geht klar ich dachte nur das  es etwas einfacher wird wenn die leute wissen das ich ein anfänger bin, da kommt doch eher verständins dabei raus.

        Der Titel eines Postings lässt sich in jeder Vorschau ändern.

        Gerade als Anfänger solltest du eigentlich Vorschauen nutzen und das angebotene Formular wahrnehmen.

        mfg Beat

        --
        ><o(((°>           ><o(((°>
           <°)))o><                     ><o(((°>o
        Der Valigator leibt diese Fische
  4. 'ǝɯɐu$ ıɥ

    <a href="memberliste.html"><p>hier unsere Mitglieder</p>
            <img src="images/pwna.jpg" heigt="250px" width="250px" border="0"/>
            </a>

    Nur mal so am Rande, du hast einen Verschachtelungsfehler (wehe einer sagt jetzt: aber HTML5 da darf...), das <p> kommt nach außen, bemühe bitte das nächste mal einen Validator der hätte es dir gesagt.

    ssnɹƃ
    ʍopɐɥs

    --
    !edis gnorw eht morf siht ta gnikool era uoY