tutorials.de Buch-Aktion 05/2012
ERLEDIGT
JA
ANTWORTEN
7
ZUGRIFFE
1505
EMPFEHLEN
  • An Twitter übertragen
  • An Facebook übertragen
DIESES THEMA IST
GESCHLOSSEN
  1. 17.09.08 15:18 #1
    oONeo2kOo oONeo2kOo ist offline Grünschnabel
    Registriert seit
    Sep 2008
    Beiträge
    4
    Hallo, ich möchte gerne Text in eine Zeile schreiben, wobei ein Teil links und ein Teil rechts stehen soll.

    wie mache ich das am bessten?!

    hier noch ein Bild, wie das Ergebniss aussehen soll
    Miniaturansicht angehängter Grafiken Miniaturansicht angehängter Grafiken Text in einer Zeile, ein Teil links, ein Teil rechts?!-unbenannt-1.jpg  
     
  2. 17.09.08 15:26 #2
    Avatar von ZodiacXP
    ZodiacXP ZodiacXP ist offline
    Registriert seit
    Mar 2004
    Beiträge
    1.854
    Blog-Einträge
    2
    Kanns ja damit mal ein bisschen rumwerkeln:
    HTML-Code:
    <style type="text/css">
.left
{
	float : left;
}
.right
{
	float : right;
}
</style>
<div class="left">
	Links
</div>
<div class="right">
	Das andere Links :P
</div>
     
    Gebe keine Hilfe per PN, Mail, Instant Messenger etc.
    und keine Copy&Paste-Lösungen - ein bisschen selbst nachdenken sollte drin sein. Konstruktivismus 4tw!

    MfG, Zod

    __________________
    rpd Framework: Rapid Web-Engineering in PHP (Manual | Google Code)
  3. 17.09.08 16:21 #3
    Maik Tutorials.de Gastzugang
    Hi,

    ZodiacXPs Vorschlag enthält aber nur die halbe Wahrheit, denn ein anschliessendes Aufheben der Floatumgebung mittels der clear-Eigenschaft gehört selbstverständlich genauso dazu, wie die Errrichtung selbiger, um im Dokument wieder den normalen Textfluß herzustellen.

    Siehe hierzu meinen Webmaster-FAQ-Artikel [CSS] Warum passt sich die Boxenhöhe nicht dem Inhalt an?, was ansonsten die Folgen in den standardkonformen Browsern sein können, die hier im CSS-Board schon sooo oft in vielen Variationen erörtert wurden, dass ich daraufhin diesen Artikel verfasst habe.

    mfg Maik
     
  4. 17.09.08 16:44 #4
    oONeo2kOo oONeo2kOo ist offline Grünschnabel
    Registriert seit
    Sep 2008
    Beiträge
    4
    das hatte ich schon probiert, aber komische weise, hing dannn das sebastian-stiemer.de bissel höher als die Navigation -.-
     
  5. 17.09.08 16:46 #5
    Maik Tutorials.de Gastzugang
    Dann zeig mal bitte den HTML- und CSS-Code deines Versuchs.

    mfg Maik
     
  6. 17.09.08 16:49 #6
    oONeo2kOo oONeo2kOo ist offline Grünschnabel
    Registriert seit
    Sep 2008
    Beiträge
    4
    HTML-Code:
    <body>
	<div id="wrapper">
    	<div id="navi">  
      	<div class="float_right">
            bla bla
        </div>
        <div class="float_right">
           bla bla
        </div>
      	<div class="float_right">
         	Farbschema:
         </div>
         <div class="float_clear">         
         	<div class="float_left">	
            	<a href="index.php"><span class="lila">n</span>ews</a> 
               <a href="about_me.php"><span class="lila">a</span>bout me</a> 
               <a href="videos.php"><span class="lila">v</span>ideos</a> 
               <a href="links.php"><span class="lila">l</span>inks</a> 
               <a href="impressum.php"><span class="lila">i</span>mpressum</a>   
          	</div>
            <div class="floar_right">         
            	sebastian<span class="lila">-</span>stiemer<span class="lila">.de</span>   
            </div>           
         </div>
      </div> <!--#navi-->
      <div id="header_linie_oben" class="float_clear">
&nbsp;      </div> <!---#header_linie_oben-->
      <div id="header">
&nbsp;      </div> <!---#header-->
      <div id="header_linie_unten">
&nbsp;      </div> <!---#header_linie_unten-->
      <div id="content">
      </div><!---#content-->
    </div> 
<!--#wrapper-->
</body>

    HTML-Code:
    * { padding: 0; margin: 0; } 

html, body { 	
	min-height: 100%; /* Mindesthöhe in modernen Browsern */
	height: 100%; /* Mindesthöhe in IE (<7) */

}

.float_right{
	float:right;
}

.float_left{
	float:left;
}

.float_clear{
	clear:both;
}

#wrapper {
	margin:auto;
	width:903px;
	min-height: 100%; /* Mindesthöhe in modernen Browsern */
	height: 100%; /* Mindesthöhe in IE (<7) */

}
	#navi{
		padding:0px 60px;
	}		
	
		#navi div{
			margin:1px;
			margin-top:10px;
		}
	
	#header_linie_oben{
		height:20px;
		background:url(layout/header_linie_oben_orange.png);
	}
	
	#header{
		height:243px;
		background:url(layout/header.png);
	}
	
	#header_linie_unten{
		background:url(layout/header_linie_unten_orange.png);
	}
	
	#content{		
		padding:0px 60px;
		background:url(layout/bg.png);
	}
     
  7. 17.09.08 17:00 #7
    Maik Tutorials.de Gastzugang
    Kleiner Schreibfehler mit großer Wirkung:

    Code :
    1
2
3

    <div class="floa[color=red]r[/color]_right">
      sebastian<span class="lila">-</span>stiemer<span class="lila">.de</span>
</div>
    mfg Maik
     
  8. 17.09.08 17:03 #8
    oONeo2kOo oONeo2kOo ist offline Grünschnabel
    Registriert seit
    Sep 2008
    Beiträge
    4
    *umph*

    dankeschön ; )

    was so ein kleiner Fehler so ausmachen kann ; )
     
« Schriftfarbe XML? | DIV vertikal zentrieren ohne feste Größe »

Ähnliche Themen

  1. rechts ,zentriert und links bündig auf einer Zeile
    Von jfg1 im Forum HTML & XHTML
    Antworten: 4
    Letzter Beitrag: 31.10.10, 19:24
  2. Teil Schwarz/Weiß , Teil farbig
    Von Stuntman im Forum Photoshop
    Antworten: 9
    Letzter Beitrag: 04.07.10, 14:17
  3. Ausgehende Links - Menü im oberen Teil
    Von PC Freak im Forum Javascript & Ajax
    Antworten: 1
    Letzter Beitrag: 25.09.09, 08:35
  4. 3 Divs, einer links oben, einer links unten und rechts einer daneben !
    Von ZipZek im Forum CSS
    Antworten: 6
    Letzter Beitrag: 30.12.07, 13:26
  5. Text im oberen Teil wiedergeben
    Von toggenburg im Forum PHP
    Antworten: 8
    Letzter Beitrag: 29.05.05, 17:28