1. Liebe Forumsgemeinde,

    aufgrund der Bestimmungen, die sich aus der DSGVO ergeben, müssten umfangreiche Anpassungen am Forum vorgenommen werden, die sich für uns nicht wirtschaftlich abbilden lassen. Daher haben wir uns entschlossen, das Forum in seiner aktuellen Form zu archivieren und online bereit zu stellen, jedoch keine Neuanmeldungen oder neuen Kommentare mehr zuzulassen. So ist sichergestellt, dass das gesammelte Wissen nicht verloren geht, und wir die Seite dennoch DSGVO-konform zur Verfügung stellen können.
    Dies wird in den nächsten Tagen umgesetzt.

    Ich danke allen, die sich in den letzten Jahren für Hilfesuchende und auch für das Forum selbst engagiert haben. Ich bin weiterhin für euch erreichbar unter tti(bei)pcwelt.de.
    Dismiss Notice

Float Left Problem

Discussion in 'Web-Know-how für die Homepage' started by Scari36, Sep 5, 2010.

Thread Status:
Not open for further replies.
  1. Scari36

    Scari36 Byte

    Hallo, ich bin gerade dabei eine neue Homepage zu erstellen und jetzt habe ich das Problem, dass die Eigentschaft "Float: Left;" nicht so arbeitet wie ich es mir vorstellte. Bei meinen bisherigen Websites, habe ich den Code der Div Container mit denen ich arbeite genau so geschrieben wie jetzt bei meiner Neuen. Jedoch wird komischerweise der float: left; Container zwar linksbündig angezeigt, aber nicht neben dem zentriertem Div Container sondern darunter. Bitte um Hilfe.

    Screenshot: http://scarfaceone.bplaced.net/ScreenshotWebsitefloat.jpg

    Bisheriger Code:
    Code:
    <html>
    <head><title>Tutorials & Weiteres</title>
    <link rel="shortcut icon" href="http://www.it-profibox.de/bilder/fragezeichen.gif" type="image/gif.microsoft.icon">
    
    
    
    <meta http-equiv="content-type" content="text/html; charset=utf8">
    <style type="text/css">
    .roundedbox1 {
    	width: 60&#37;;
            background-color: #222222; float:
    	-moz-border-radius: 5px;
    	-webkit-border-radius: 5px;
    	border: 1px solid #ffd700;
    	padding: 10px;
    }
    </style>
    
    
    <meta http-equiv="content-type" content="text/html; charset=utf8">
    <style type="text/css">
    .roundedbox2 {
    	width: 100px;
            height: 720px;
            background-color: #222222;   float: left;
    	-moz-border-radius: 5px;
    	-webkit-border-radius: 5px;
    	border: 1px solid #ffd700;
    	padding: 10px;
    }
    </style>
    
    
    
    
    
    </head>
    <body background="bg.jpg">
    <table width="90%" height="100%" align="center">
    <td width="90%">
    
    
    <center>
    <div class="roundedbox1">
    <font color="#ffd700">
    <font face="lucida">
    
    Text, Text, Text, Text ...
    
    </font>
    </font>
    </div>
    </center>
    
    <div class="roundedbox2">
    <font color="#ffd700">
    <font face="lucida">
    Text&#178;, Text&#178;, Text&#178; ...
    
    
    </font></font>
    </div>
    
    
    
    </td>
    </table>
    </body>
    </html>
     
    Last edited: Sep 5, 2010
  2. chipchap

    chipchap Ganzes Gigabyte

    Hallo Scari36!

    Vertausche mal die Plätze des Codes für "roundedbox1" und "roundedbox2", dann müßte es gehen.
    Bei mir geht es jedenfalls in Frontpage 2000:

    [​IMG]

    Gruß chipchap
     
  3. salim_aliya

    salim_aliya Halbes Megabyte

    Du hast ja in deinem Quelltext schon damit begonnen, mit <tables> zu arbeiten. Warum benutzt du den nicht zu Ende?

    Ich w&#252;rde eine <table> Struktur aufbauen und dann die Container jeweils in die Abschnitte einf&#252;gen.

    Ein Beispiel:

    Code:
    <html>
    <head><title>Tutorials & Weiteres</title>
    <link rel="shortcut icon" href="http://www.it-profibox.de/bilder/fragezeichen.gif" type="image/gif.microsoft.icon">
    
    <meta http-equiv="content-type" content="text/html; charset=utf8">
    
    <style type="text/css">
    .roundedbox1
    {
    	width: 60&#37;;
            background-color: #222222; float:
    	-moz-border-radius: 5px;
    	-webkit-border-radius: 5px;
    	border: 1px solid #ffd700;
    	padding: 10px;
    }
    
    .roundedbox2
    {
    	width: 100px;
            height: 720px;
            background-color: #222222;
    	-moz-border-radius: 5px;
    	-webkit-border-radius: 5px;
    	border: 1px solid #ffd700;
    	padding: 10px;
    }
    </style>
    
    </head>
    
    <body background="bg.jpg">
    
    <table width="1000" align="center" border="1">
    <tr>
    	<td width="200" rowspan="2" align="center"><div class="roundedbox2"><font color="#ffd700" face="lucida">Text&#178;,<br>Text&#178;,<br>Text&#178; ...</font></div></td>
    	<td align="center"><div class="roundedbox1"><font color="#ffd700" face="lucida">Text, Text, Text, Text ...</font></div></td>
    </tr>
    <tr>
    	<td valign="top">Dein Lesetext</td>
    </tr>
    </table>
    
    </body>
    </html>
    
     
Thread Status:
Not open for further replies.

Share This Page