Antworten auf deine Fragen:
Neues Thema erstellen

Frage wegen Float

Lona

Aktives Mitglied

Ich arbeite gerade Littl boxes durch , nun bin ich auf eine Problem bei Floaten gestossen.
Ich habe eigentlich alles gemacht wie es beschrieben ist ...aber es klappt leider nicht .
Ich wollte die Bildergalerie nachbauen und habe folgenden Code genommenCSS..
Code:
<style type="text/css">
body {
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: small;
}
h2 { font-size: 130%; }
h3 {
  font-size: 110%;
  margin: 0 0 1em 0;
}
div.galerie {
  background-color: #eee;
  width: 500px;
  padding: 10px;
  padding-top: 25px;
  border: 1px solid black;
  margin: 0 3px 3px 0;
}
div.galerie img {
  float: left;
  margin-right: 15px;
}



</style>
Leider ändert sich bei mir nichts...es sollte Bild 2 versetzt nach rechts sein aber die beiden Bilder stehen nach wie vor untereinander.


HTML:
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="de" xml:lang="de">
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  <title>Startseite Lernen mit little Boxes</title>
 <style type="text/css">
body {
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: small;
}
h2 { font-size: 130%; }
h3 {
  font-size: 110%;
  margin: 0 0 1em 0;
}
div.galerie {
  background-color: #eee;
  width: 500px;
  padding: 10px;
  padding-top: 25px;
  border: 1px solid black;
  margin: 0 3px 3px 0;
}
div.galerie img {
  float: left;
  margin-right: 15px;
}



</style>



 <link href="bildschirm.css" rel="stylesheet" type="text/css" media="screen" />
  <link href="navi.css" rel="stylesheet" type="text/css" media="screen" />

  </head>
<body id="kontaktseite">

   <div id="wrapper">

<div id="kopfbereich">
<h1><img src="logo.gif" id="logo" alt="Little Boxes" width="222"
height="32" /></h1>
<p>Webseiten gestalten mit HTML und CSS<span> Grundlagen</span>.</p>
</div> <!-- Ende kopfbereich -->

<div id="navibereich">
 <ul>
<li id="navi01"><a href="index.html">Startseite</a></li>
<li id="navi02"><a href="kontakt.html">Kontakt</a></li>
</ul>

</div> <!-- Ende navibereich -->

<div id="textbereich">

             <h2>Die Galerie</h2>
<div class="galerie">
<img src="landschaft01.jpg" width="203" height="180" alt="Von Bäumen umstandener See, in dem sich Wolken spiegeln" />
<h3>Landschaftsbild 01</h3>
<p>Lorem ipsum dolor sit amet, ...</p>
</div> <!-- Ende .galerie 01 -->
<div class="galerie">
<img src="landschaft02.jpg" width="203" height="180" alt="Weite Grasfläche mit Wolken und Halmen im Vordergrund" />
<h3>Landschaftsbild 02</h3>
<p>Lorem ipsum dolor sit amet, ...</p>
</div> <!-- Ende .galerie 02 -->
<p>Alle Fotos von <a href="http://pixelio.de/">pixelio.de</a></p>




</div>
<!-- Ende textbereich -->

<div id="fussbereich">
  <address>
RoseMarie Hellriegel&middot; Lindenstrasse50 &middot; 01234 06679 Hohenmölsen
<br />
Tel: 034441/23378&middot;
</address>


</div> <!-- Ende fussbereich -->

</div> <!-- Ende wrapper -->












<!-- Sichtbarer Teil der Webseite, noch leer -->

































</body>
</html>
Könnte mal jemand drüberschauen?ich komme nicht dahinter was verkehrt sein könnte.
Danke schonmal
 
Zuletzt bearbeitet von einem Moderator:

AW: Frage wegen Float

Wie schon cebito anreisst: Du floatest zwar jedes einzelne <img> innerhalb der <div>s, die aber selbst erstens Blockelemente darstellen (und damit auf natürliche Weise umbrechen) und zweitens selbst nicht floaten ! Gib doch mal auch den divs ein float:left. Wenn's dann immer noch nicht will, kannst Du ja mal versuchsweise über display: inline die Blockartigkeit der Divs aufheben
 
AW: Frage wegen Float

Danke für die Atworten...ich habe es gemacht wie es in der Anleitung beschrieben ist..
Ich versuche es nochmal heute Nachmittag.
Es ist nur ich fange ja erst so richtig an zu lernen...da guckt man dann immer dumm aus der Wäsche,wenn es nach Anleitung doch nicht hinhaut.
Ich kenne mich leider nicht so aus...
 
AW: Frage wegen Float

Ich glaube, Du haßt .clearing { clear: both; } vergessen.
Wenn man sich erst einarbeitet und irgenetwas vergißt, bekommt man graue Haare.
Meine eigene Erfahrung.
 
AW: Frage wegen Float

Nein es ist ganz anders..im FF ist es richtig so wie beschrieben aber mein Phase 5 nimmt den IE da wird es falsch angezeigt...
Hab mal die Datei mit FF geöffnet und da war es richtig...muss gleich nochmal fragen wie ich PH 5 einstellen kann dass die Voransicht mit dem FF angezeigt wird..
 
AW: Frage wegen Float

Uff... Phase5 is schon ne weile her. Aber wenn ich mich nicht Täusche dann Einstellungen -> Browser intern/extern sein...

Gruß Adrian
 
AW: Frage wegen Float

Uff... Phase5 is schon ne weile her. Aber wenn ich mich nicht Täusche dann Einstellungen -> Browser intern/extern sein...

Gruß Adrian
Richtig, über "Browser hinzufügen" kannst dann alle möglichen einfügen und später über den Pfeil(Dreieck) neben dem internen Browser auswählen.
 
Bilder bitte hier hochladen und danach über das Bild-Icon (Direktlink vorher kopieren) platzieren.
Antworten auf deine Fragen:
Neues Thema erstellen

Willkommen auf PSD-Tutorials.de

In unseren Foren vernetzt du dich mit anderen Personen, um dich rund um die Themen Fotografie, Grafik, Gestaltung, Bildbearbeitung und 3D auszutauschen. Außerdem schalten wir für dich regelmäßig kostenlose Inhalte frei. Liebe Grüße senden dir die PSD-Gründer Stefan und Matthias Petri aus Waren an der Müritz. Hier erfährst du mehr über uns.

Stefan und Matthias Petri von PSD-Tutorials.de

Nächster neuer Gratisinhalt

03
Stunden
:
:
25
Minuten
:
:
19
Sekunden

Flatrate für Tutorials, Assets, Vorlagen

Zurzeit aktive Besucher

Statistik des Forums

Themen
118.745
Beiträge
1.539.161
Mitglieder
67.696
Neuestes Mitglied
Preussen
Oben