kostenloser Webspace werbefrei: lima-city

Text Problem!

lima-city → Forum → Die eigene Homepage → HTML, CSS & Javascript

1. Autor dieses Themas

   unsereklasse

   unsereklasse hat kostenlosen Webspace.

   21:50, 20.11.2013

   Hallo,
   ich habe da mal eine Frage zu meiner Gestaltung. Unswar habe ich auf meiner Homepage, jeweils rechts und links, einen namen und einen Text zu dieser Person . Nun mein Problem:
   Die Texte zu den Personen stehen neben ihnen ! Wie krieg ich es hin sie unter den Namen zu platzieren?
   
   http://unsereklasse.lima-city.de/
   
   Vielen Dank im vorraus!
   Florian

2. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

   lima-city: Gratis werbefreier Webspace für deine eigene Homepage

3. aff3m1tw4ff3

   aff3m1tw4ff3 hat kostenlosen Webspace.

   22:33, 20.11.2013

   Hi,
   
   sieht generell sehr komisch aus was Du da machst,
   mal auf die schnelle, verpacke die DIV´s mit float ectr. und nicht die <p>.
   Dann kannst Du die Div anordnen wie Du sie brauchst und innerhalb
   dieser dann Deinen Text formatieren.
   
   

   <div class="namen">
   		Die Klasse 9a des Friedrich-Magnus-Schwerd-Gymnasiums
   		</div>
                   <div style="float: left;" class="namen">
                           <p >
                           Veit Erren
                           </p>
                               <p>
                               Veit ist das Genius unserer Klasse.<br>
                               Er ist sehr gut in Geschichte, Chemie und Physik.<br>
                               Nur manchmal ist er psychisch nicht ganz beim Unterrich<br>
                               und macht so seine epo Noten kaputt.<br>
                               </p>
                       </div>
                   <div style="float: left;">
                           <p>
                           Florian Kiptschuk
                           </p>
                               <p>
                               Florian ist der Gründer dieser Seite.<br>
                               Er lacht sehr viel und macht Witzte<br>
                               die hinundwieder witzig oder auch nicht witzig sind.<br>
                               Alle meinen das er den meisten Müll macht,<br>
                               was natürlich nur die hinteren zwei Reihen in der Klasse betrifft.<br>
                               Dabei hat er immer die beste epo Note in der Reihe,<br>
                               dies ist sehr wichtig für ihn da er schriftlich eine Niete ist.<br>
                               </p>
                   </div>

   
   
   Vieleicht hilft es Dir ja weiter
   Gruß Marco
   
   
   Beitrag zuletzt geändert: 20.11.2013 22:34:24 von aff3m1tw4ff3

4. daswing

   Moderator

   daswing hat kostenlosen Webspace.

   23:07, 20.11.2013

   Hallo unsereklasse,
   
   nur um dein Problem zu lösen reicht der kurze Ausdruck

   overflow: hidden;

   aus. Damit unterbindest du das etwas anderes dort mit hinein rutschen kann.
   Also die Zeile 12 deines stil.css in folgendes ändern:
   

   .namen {
       font-size: 300%;
       margin: auto;
       overflow: hidden;
   }

   
   Sinnvoller ist es tatsächlich, wie aff3m1tw4ff3 schon erwähnte, die zusammenhängenden Texte in ein DIV zu packen und beide anschließend zu floaten. Für die bessere Darstellung bei hochauflösenden oder/und breiteren Geräten empfiehlt es sich übrigens den Inhalt in der Breite zu begrenzen und mittig zu platzieren. Darin kannst du anschließend die Textboxen platzieren. Ähnlich wie dem folgenden Beispiel:
   

   <div id="mittig-platzieren">
   	<div id="links">
   		<p>Mein Name</p>
   		<p>Mein Text</p>
   	</div>
   	<div id="rechts">
   		<p>Mein Name</p>
   		<p>Mein Text</p>
   	</div>
   </div>

   
   

   #mittig-platzieren {
   	margin: auto;
   	width: 1000px;	
   	overflow: hidden;
   }
   
   #links {
   	float: left;	
   }
   
   #rechts {
   	float: right;	
   }

   
   
   Wenn du noch Fragen zu CSS oder HTML hast bist du im Forum gern gesehen.
   
   MfG daswing
   
   Beitrag zuletzt geändert: 20.11.2013 23:10:50 von daswing

5. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

   lima-city: Gratis werbefreier Webspace für deine eigene Homepage

Dir gefällt dieses Thema?