✔ Foto von Text umfliessen

Status
Nicht offen für weitere Antworten.
B

buddha

Erfahrenes Mitglied
Hallo,
Ich habe ein Foto im content rechts positioniert,dieses sollte eigentlich vom Text umflossen werden. Die Erklärung in der Bibel hat mich auch nicht weitergebracht.
HTML: 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Tante JU</title>
<link href="css/layout.css" rel="stylesheet" type="text/css" />
<link href="css/navigation.css" rel="stylesheet" type="text/css" />
<script src="Scripts/AC_RunActiveContent.js" type="text/javascript"></script>
<style type="text/css">
#content { overflow-x: hidden;}
</style>
</head>
<body>
<div class="terminalinfodate" id="content">
<img class="header" src="images/header.gif" alt="header"/> <img class="left" src="images/left.gif" alt="left" /> <img class="footer" src="images/footer.gif" alt="footer" /> <img class="right" src="images/right.gif" alt="right" /> <img class="tanteju" src="images/tanteju.jpg" alt="tanteju" />
<div><a href="rueckblick06.html"><img src="images/rueckblick1.jpg" alt="r&uuml;ckblick" border="0" class="r&uuml;ckblick"/></a></div>
<div class="marquee">
  <script type="text/javascript">
AC_FL_RunContent( 'codebase','http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0','width','500','height','70','movie','marquee/tanteju','quality','high' ); //end AC code
  </script>
  <noscript>
  <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="500" height="70">
    <param name="movie" value="marquee/tanteju.swf" />
    <param name="quality" value="high" />
  </object>
  </noscript>
</div>
<!-- ImageReady Slices (navigation.jpg) -->
<table id="Tabelle_01" width="783" border="0" cellpadding="0" cellspacing="0">
  <tr>
    <td><img id="navigation_01" src="images/navigation_01.gif" width="50" height="110" alt="" /></td>
    <td><a href="index.html"> <img id="news" src="images/news.gif" width="76" height="110" border="0" alt="index" /></a></td>
    <td><a href="terminal.html"> <img id="terminal" src="images/terminal.gif" width="75" height="110" border="0" alt="terminal" /></a></td>
    <td><a href="tickets.html"> <img id="tickets" src="images/tickets.gif" width="76" height="110" border="0" alt="tickets" /></a></td>
    <td><a href="luftpost.html"> <img id="luftpost" src="images/luftpost.gif" width="76" height="110" border="0" alt="luftpost" /></a></td>
    <td><a href="anfahrt.html"> <img id="anfahrt" src="images/anfahrt.gif" width="75" height="110" border="0" alt="anfahrt" /></a></td>
    <td><a href="clubinfo.html"> <img id="clubinfo" src="images/clubinfo.gif" width="76" height="110" border="0" alt="clubinfo" /></a></td>
    <td><a href="vermietung.html"> <img id="vermietung" src="images/vermietung.gif" width="76" height="110" border="0" alt="vermietung" /></a></td>
    <td><a href="kontakt.html"> <img id="kontakt" src="images/kontakt.gif" width="75" height="110" border="0" alt="kontakt" /></a></td>
    <td><a href="gaestebuch.html"> <img id="gaestebuch" src="images/gaestebuch.gif" width="76" height="110" border="0" alt="gaestebuch" /></a></td>
    <td><img id="navigation_11" src="images/navigation_11.gif" width="52" height="110" alt="" /></td>
  </tr>
</table>
<!-- End ImageReady Slices -->
<p class="clubinfoJU">Die &quot;Tante JU&quot;, wie die JU 52 liebevoll genannt wurde, entwickelte sich wie kein anderes Flugzeug ihrer Zeit zum Synonym f&uuml;r Zuverl&auml;ssigkeit und komfortables Reisen. Urspr&uuml;nglich als Frachtflugzeug geplant und gebaut, erkannte Prof. Hugo Junkers bald den Nutzen der JU 52 im Passagierverkehr &ndash; und aus der &quot;Tante JU&quot; wurde das erste Gro&szlig;serienflugzeug der Welt. Einige Exemplare fliegen sogar noch heute.</p>
<p class="clubinfoJU">Es ist die Liebe zur Fliegerei, die Hobby &ndash; Pilot und Club &ndash; G&uuml;nther Rehlig dazu veranlasste seiner Location diesen Stil zu geben &ndash; und schlie&szlig;lich diesen Namen.</p>
<img class="fotoju" src="images/ju52.jpg" height="176" width="263" alt="ju52" style="float:right" />
</body>
</html>
Code: 
/* tante ju*/
body {background-color: #000066;}
#content {width: 783px;height:525px;background-color: #FFFFFF;overflow: scroll;	margin: 50px auto;}
.tanteju { width:140px; height:80px; position:relative; left: 15px; top: 18px; }
.rückblick { position:relative; height:70px; width:70px; margin-left: 660px; margin-top: -90px; background-attachment:fixed; }
.navileiste {position: relative;margin-top: 0px;margin-right: 15px;margin-left: 15px;}
.marquee { width:500px; height:70px; position:relative; margin-left: 160px; margin-top: -50px; }
.header {background-image: url(../images/header.gif);position: absolute; width:770px;}
.left {	background-image:url(../images/left.gif);	position:absolute;	height:520px;}
.footer { background-image:url(../images/footer.gif);position: absolute;width: 770px; height:15px; margin-top:510px;}
.right {background-image:url(../images/right.gif);position:absolute;height:520px;width: 15px; margin-left:755px;}
.p {font-family:Verdana, Arial, Helvetica, sans-serif;	font-size: 11px;	color: #013998;	text-align:justify;	padding-left: 45px;	padding-right: 45px;}
.pind { font-family: Verdana, Arial, Helvetica, sans-serif; font-weight: bold; color: #990000; font-size:11px; font-style: oblique;}
.pclubinfo {font-family:Verdana, Arial, Helvetica, sans-serif;	font-size: 11px;color: #013998;	text-align:justify;	padding-left: 45px;	padding-right: 45px; padding-top:10px;}
.pclubinfo1 {font-family:Verdana, Arial, Helvetica, sans-serif;font-size: 11px;color: #013998;padding-right: 45px;padding-top: 5px;}
.clubinfoJU {font-family:Verdana, Arial, Helvetica, sans-serif;font-size: 11px;color: #013998;	padding-left: 45px;	padding-right: 45px;padding-top:10px;	text-align: justify;}
.fotoju {	padding-right: 40px;	margin-left: 10px;	margin-top: -62px;}
.pindtop { margin-top:35px;}
.pinddate {	font-family: Verdana, Arial, Helvetica, sans-serif;	font-weight:bold; color:#013998; font-size:11px; font-style:oblique; margin-left:405px; }
.fotooben {	background-image:url(terminalinfo/klimakalima.jpg);	background-repeat:no-repeat;margin-top: 30px;float: right;	margin-right: 40px;	margin-left: 10px;	margin-bottom: 5px;}
.fotoobentext {	font-family:Verdana, Arial, Helvetica, sans-serif;	font-size: 11px;	color: #013998;	text-align:justify;	margin-top: 30px;	margin-left: 40px;	margin-right: 40px;}
.fotoobendatum {font-family: Verdana, Arial, Helvetica, sans-serif;	color: #990000;	font-size:11px;	font-weight: bold;	margin-left: 40px;}
.fotounten {	padding-right: 40px;	margin-top: -20px;}
.fotountentext {font-family:Verdana, Arial, Helvetica, sans-serif;	font-size: 11px;color: #013998;	text-align:justify;	padding: 10px 40px 0 40px;}
.fotountendatum {font-family:Verdana, Arial, Helvetica, sans-serif;	font-size: 11px;color:#990000;	text-align:justify;	font-weight:bold;	margin-left: 40px;	margin-top: -93px;}
.preis {font-family: Verdana, Arial, Helvetica, sans-serif;	color: #013998;	font-size:11px;	font-weight:bold;}
.Stil1 {color: #FF0000;	font-weight: bold;}
.Stil3 {color: #013998;	right: 50px;}
.back {font-family:Verdana, Arial, Helvetica, sans-serif; font-weight:bold;color:#013998; font-size:11px; margin-left: 45px; margin-top:30px;}
.pback {font-family:Verdana, Arial, Helvetica, sans-serif;	color:#013998;	font-size:11px;	font-weight:normal;	margin-top: 20px;}
.pbackeinzug {position:absolute;margin-left:240px;font-family:Verdana, Arial, Helvetica, sans-serif;color:#013998;font-size:11px;font-weight:normal;margin-top: -195px;}
th,td,tr { font-family:Verdana, Arial, Helvetica, sans-serif; font-size:11px; text-align:justify;}
th { color: #013998; font-weight:normal;}
td { color: #013998;}
.imganfahrt { margin-right:70px;}
.panfahrt {	font-family:Verdana, Arial, Helvetica, sans-serif;	font-size: 11px;color: #013998;	text-align:justify;	margin-left: 120px;	margin-top: -260px;}
.print {font-size: 12px;color: #013998;	font-weight:bold;	font-family:Verdana, Arial, Helvetica, sans-serif;	margin-left: 120px;	position: absolute;	margin-top: -30px;}
 
Hi,

tausch mal im HTML-Code die Reihenfolge der Elemente, denn das zu umfliessende Element (mit der float-Deklaration) wird zuerst genannt.
 
Status
Nicht offen für weitere Antworten.

Neue Beiträge

Zurück