[TYPO3-german] - GELOEST- Einfaches Problem: Horizontales Navi

[level R]

Hallo zusammen
ich antworte auf diesen Beitrag, weil das Problem nun damit geloest ist 
nurdisplay: inline;bei li einzufuegen, hat das Problem nicht geloest;
erst durch die zweite Zeilefloat: left;ist die Navigation jetzt endlich horizontal!
Damit auch alles auf einer Zeile Platz hat, habe ich die Navigation auf 700px erweitert [wobei natuerlich auch weniger gereicht haette]
Unten stehend die korrigierten Stellen des Codes:
div#navigation {   
  width:700px; /* von 200px auf 700px erweiert */
  float:left;
}
ul.navi li   {   
  display: inline; /* diese Zeile ist neu - hier koennte auch display:block; stehen */
  float: left;       /* das ist die entscheidende Zeile - ohne diese ist die obere Zeile wirkungslos */
  margin-bottom:0.2em;
} 


BESTEN DANK AN EUCH ALLE!

Gruesse,Alain



PS:
float:left;koennte auch in diesem Teil stehen, das Menue waere dann genauso horizontal
ul.navi li a { 
  display:block;
 /* wenn float:left; hier steht, und nicht bei der obigen Position, hat es den gleichen Effekt */ 
  padding:0.2em 0.2em;
  text-decoration:none;
  color:#905D23;
  font-weight:bold;
  border:1px solid #E39F53;
  background-color:#FFD29F;
} 






> From: liste at lisardo.de
> Date: Mon, 25 Jun 2012 15:03:08 +0200
> To: typo3-german at lists.typo3.org
> Subject: Re: [TYPO3-german] Einfaches Problem: Horizontales Navi
> 
> Hallo Alain, 
> 
> es gibt natürlich einen Unterschied zwischen 
> 
> li {display:inline}
> und 
> li a {display:inline}
> 
> li a muss mit display:block formatiert werden (das ist der Link, der dadurch so groß wird wie der umgebende Container)
> li jedoch mit display:inline oder display:inlineblock (das heisst, li wird vom Block-Element zum Inline-Element. )
> 
> Richtig ist also: 
> 
> li {display:inline}
> und 
> li a {display:block}
> 
> Gruß
> Peter
> 
> Oder besser: 
> 
> li {display:block; float: left}
> und 
> li a {display:block}
> 
> 
> 
> 
> Am 25.06.2012 um 13:29 schrieb level R:
> 
> > 
> > Hallo Peter
> > Danke fuer die prompte Antwort.Diesen Vorschlag hatte ich bereits ausprobiert, aber leider aendert das nichts...Die Navigation ist mit einem orangen Hintergrund hinterlegt.Wenn ich
> > display: block;
> > mit
> > display:inline;
> > ersetze, bewirkt das nur, dass der orange Hintergrund nicht mehr eine Einheitslaenge hat, sondern sich der Laenge der Woerter anpasst.
> > 
> > Und wenn ich an dieser Stelle
> > display: inline;
> > schreibe, verhaelt es sich gleich, als ob ich diese Zeile komplett loeschen wuerde.
> > 
> > Also irgendwie scheint er
> > display:inline;
> > gar nicht zu verstehen....
> > 
> > Gruss,Alain
> > 
> > 
> >> Date: Mon, 25 Jun 2012 13:22:20 +0200
> >> From: peter at function2form.net
> >> To: typo3-german at lists.typo3.org
> >> Subject: Re: [TYPO3-german] Einfaches Problem: Horizontales Navi
> >> 
> >> Am 25.06.2012 13:11, schrieb level R:
> >>> ul.navi li a { 	display:block;
> >> Hallo Alain,
> >> 
> >> mit dem Eintrag oben legst Du fest, dass die a-tags eben nicht inline 
> >> dargestellt werden sollen. Ich würd das weglassen, und statt dessen
> >> 
> >> ul.navi li { display:inline;
> >> 
> >> (oder inline-block;) schreiben.
> >> 
> >> Schöne Grüße,
> >> Peter
> >> 
> >> -- 
> >> 
> >> http://function2form.net
> >> http://peter-kuehnlein.net
> >> 
> >> "Most people's personal appearance is poor because they don't look into the mirror well enough."
> >> (Hagakure)
> >> 
> >> _______________________________________________
> >> TYPO3-german mailing list
> >> TYPO3-german at lists.typo3.org
> >> http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
> > 		 	   		  
> > _______________________________________________
> > TYPO3-german mailing list
> > TYPO3-german at lists.typo3.org
> > http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
> 
> --
> Xing: http://www.xing.com/profile/Peter_Linzenkirchner
> Web: http://www.typo3-lisardo.de
> Facebook: http://tinyurl.com/lisardo-multimedia
> 
> _______________________________________________
> TYPO3-german mailing list
> TYPO3-german at lists.typo3.org
> http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german