Bild mit html positionieren float:right

[celia]

Guten Abend! Ich bin hier grad reingestolpert und ohne schleimen zu wollen: Ich (be)wundere die Menschen, die hier blutigen Anfängern wie mir etwas erklären. Dafür danke im Vorraus.

Mein Problem erklärt sich, wenn man auf diese Seite hier guckt(das ist nur ein Screenshot). Ich habe mir irgendwo diese Bildbox als Vorlage kopiert, obwohl ich ja schon verstanden habe, dass Frames ganz ganz böse sind.

Wahrscheinlich ist mein Problem gar nicht so gravierend und liegt nur daran, dass ich mit meiner try&error-Methode einen ganz furchtbaren Quelltext fabriziere. In diesem Sinne wünsche ich mir auch gar nicht unbedingt eine direkte Antwort auf meine Frage sondern eher, wie ich eine saubere und elegante Lösung finden kann. Mit dem richtigen Link zu selfhtml ist mir auch schon geholfen... Für alle, die sich jetzt wirklich mit mir auseinandersetzen ein riesenfettes Dankeschön!

Es folgt mein Quelltext:

      <div id="main">
        <div class="post"> <a name="TemplateInfo"></a>


          <!---Chicos Foto--->
<TABLE width="200" border="0" align="right" cellpadding="20" cellspacing="20" class="bildBox" hspace="10" vspace="0">
<TBODY>
        <tr>
        <td class="bildBox"><IMG src="images/edo.jpg" width="180" height="240"></td>
        </tr>
        <tr>
         <td align="center" class="bildBox">Eduardo</td>
        </tr>

</tbody>
</table>
<!---Chicos Foto Ende--->

<h1>Unser Team</h1>

<p align="justify">Eduardo schult Euch mit seinem VW Touran in der Klasse B oder auf dem Motorrad.<br>
Er spricht Spanisch und Deutsch und vor allem viel.
Mit seinen 3 Lichtjahren Berufserfahrung braucht Ihr Euch um Euren F&uuml;hrerschein keine Sorgen zu machen! <br></p>

<br> <br><br><br>

 <!---Hikmets Foto--->
<table width="200" border="0" align="right" cellpadding="20" cellspacing="20" class="bildBox" hspace="20" vspace="0">
<tbody>
<td class="bildbox"> <img src="images/hikmet.jpg" align="right" width="180" height="240" border="0">
<tr>
         <td align="center" class="bildBox">Hikmet</TD>
        </tr>

</tbody>
</table>
  <!---Hikmets Foto Ende--->

<p align="justify">Hikmet unterrichtet Euch mit seinem VW Golf plus. Er spricht T&uuml;rkisch und Deutsch.<br>
Mit ihm werdet Ihr auch eine Menge Spass im Theorieunterricht haben. Versprochen!
Und wenn ich jetzt noch ganz viel mehr &uuml;ber Hikmet schreibe dann umfliesst dieser Text
vielleicht auch sein Bild, was ich ja ganz gut finde, weil ich es so lange schon versuche. </p>

 

[ben]

hi
ich arbeite mit html auch erst 1/2 jahr aber ich glaub ich hab deinen "fehler"

ich vermute mal das du class="bildbox" mit css im head definiert hast mit float: right stimmt es?

dadurch umfliesst der text zwar das erste bild aber...
der text vom zweiten text umfliesst das zweite bild

und jetzt kommt dein fehler
das erste bild wird vom dem zweiten bild mit dem dazugehoerigem text auch umflossen

wenn du nun vor das zweite bild einfach diesen tag einfuegst muesste es gehen

<div style="clear: all"></div>

eins versteh ich aber nicht wozu verwendest du <tbody> tags in deiner tabelle diese sind nur im zusammenhang mit <thead> und <tfoot> zu gebrauchen

und hier dein link

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

ich hoffe ich konnte helfen

MfG
ben

 

[Bernhard]

Hallo Celia,
hallo ben,

hi
ich arbeite mit html auch erst 1/2 jahr aber ich glaub ich hab deinen "fehler"

ich vermute mal das du class="bildbox" mit css im head definiert hast mit float: right stimmt es?

dadurch umfliesst der text zwar das erste bild aber...
der text vom zweiten text umfliesst das zweite bild

und jetzt kommt dein fehler
das erste bild wird vom dem zweiten bild mit dem dazugehoerigem text auch umflossen

wenn du nun vor das zweite bild einfach diesen tag einfuegst muesste es gehen

<div style="clear: all"></div>

eins versteh ich aber nicht wozu verwendest du <tbody> tags in deiner tabelle diese sind nur im zusammenhang mit <thead> und <tfoot> zu gebrauchen

und hier dein link

SELFHTML: Stylesheets / CSS-Eigenschaften / Positionierung und Anzeige von Elementen

ich hoffe ich konnte helfen

MfG
ben

clear:all; gibt es nicht, aber clear:both; dürfte den "Darstellungsfehler" beheben.

Die Tabelle für das Bild ist nicht schön, besser wäre eine Definitionsliste...

Grüße
Bernhard

 

[ben]

hallo

ja sorry Bernhard hat recht clear: all gibt es nicht aber clear: both ist auch gut xD

man kann sich ja mal irren

MfG