tutorials.de Buch-Aktion 05/2012
ERLEDIGT
JA
ANTWORTEN
2
ZUGRIFFE
540
EMPFEHLEN
  • An Twitter übertragen
  • An Facebook übertragen
DIESES THEMA IST
GESCHLOSSEN
  1. #1
    buddha buddha ist offline Mitglied Gold
    Registriert seit
    Dec 2003
    Ort
    germany
    Beiträge
    180
    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-Code:
    <!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 :
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    
    /* 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;}
     

  2. #2
    Maik Tutorials.de Gastzugang
    Hi,

    tausch mal im HTML-Code die Reihenfolge der Elemente, denn das zu umfliessende Element (mit der float-Deklaration) wird zuerst genannt.
     

  3. #3
    buddha buddha ist offline Mitglied Gold
    Registriert seit
    Dec 2003
    Ort
    germany
    Beiträge
    180
    Hi,
    Danke für die schnelle Antwort hat geklappt
    Gruß
     

Ähnliche Themen

  1. <img> in <p> und mit Text umfliessen lassen
    Von Eiszwerg im Forum HTML & XHTML
    Antworten: 5
    Letzter Beitrag: 05.11.09, 20:43
  2. Text soll Hintergrundgrafik umfliessen
    Von Darian im Forum CSS
    Antworten: 3
    Letzter Beitrag: 27.05.08, 21:30
  3. Farbigen Text auf sw Foto einfügen!
    Von verursacher im Forum Photoshop
    Antworten: 2
    Letzter Beitrag: 16.02.05, 20:49
  4. Antworten: 2
    Letzter Beitrag: 29.07.04, 00:04