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@lists.typo3.org
http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
Re: [TYPO3-german] Einfaches Problem: Horizontales Navi
Am 25.06.2012 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 Alain, hast du mal inline-block getestet? Das sollte das Längenproblem jedenfalls lösen. inline reagiert tatsächlich auf Breitenangaben nicht. Schönen Gruß, 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@lists.typo3.org http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
Re: [TYPO3-german] Einfaches Problem: Horizontales Navi
Hallo Alain,
Mein spontaner Tipp wäre die Navigation breiter zu machen. 200px
scheinen doch recht wenig für eine horizontale Navi.
Viele Grüße,
Kai
Am 25.06.12 13:11, schrieb level R:
Hallo zusammen
Eigentlich glaube ich, dass die Loesung ganz einfach ist, aber ich komme schon
den ganzen Morgen nicht drauf.Ich habe eine Navigation, die ich schon
mehrmals benutzt habe. Diese ist aber vertikal, und nun soll sie horizontal
sein.
Im gewoehnlichen CSS habe ich das immer mit display: inline; gemacht. Aber
jetzt will es nicht klappen. Auch die Google-Suche und diverse CSS Tutorials
haben mich nicht auf die Loesung gebracht...
Um einen Tipp waere ich sehr dankbar!
Besten Dank fuer die Muehe im Voraus!
Alain
Der CSS Code sieht wie folgt aus:
div#navigation {
width:200px;
float:left;
}
div#navigation ul { list-style-type:none; padding:0;
margin:1em;}
div#navigation ul ul{ list-style-type:none; padding:0;
margin:0 0 0.5em 1em;}
ul.navi li {
margin-bottom:0.2em;}
ul.navi li a { display:block; padding:0.2em 0.2em;text-decoration:none;
color:#905D23; font-weight:bold; border:1px solid #E39F53;
background-color:#FFD29F;}
ul.navi li a.active { background-color:#FBB15E; border-color:#C16500;
color:#6C4112;} ul.navi li a:hover {
background-color:#F6BF80; color:#C4761F border-color:#ccc;}
ul.navi li a.active:hover { background-color:#FF9E33;
border-color:#C16500; color:#6C4112;}
ul.subnavi li { list-style-type:none; margin: 0;
padding:0; margin-bottom:0.2em;}
ul.subnavi li a { font-size:90%; padding:0.2em
0.5em;text-decoration:none; color:#AEACAA; font-weight:bold;
background-color:white; border:0;}
ul.subnavi li a:hover {
text-decoration:none; background:white;
background-image:url(pfeil_o.gif); background-repeat:no-repeat;
background-position:center left;}
ul.subnavi li a.active {background-color:#fff;
background-image:url(pfeil.gif);background-repeat:no-repeat;
background-position:center left;font-weight:bold; color:#E38114;}
ul.subnavi li a.active:hover { text-decoration:none; background:white;
color:#E38114; background-image:url(pfeil.gif);
background-repeat:no-repeat;background-position:center left;}
___
TYPO3-german mailing list
TYPO3-german@lists.typo3.org
http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
___
TYPO3-german mailing list
TYPO3-german@lists.typo3.org
http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
Re: [TYPO3-german] Einfaches Problem: Horizontales Navi
Hallo Peter Ja ich habe alle Variationen getestet. Sogar den TYPO3, Opera und Firefox Cashe geloescht und nochmal alles durch gegangen, um auch ganz sicher zu sein;die Navigation wird immer noch als vertikale Liste dargestellt Gruss,Alain Date: Mon, 25 Jun 2012 13:32:34 +0200 From: pe...@function2form.net To: typo3-german@lists.typo3.org Subject: Re: [TYPO3-german] Einfaches Problem: Horizontales Navi Am 25.06.2012 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 Alain, hast du mal inline-block getestet? Das sollte das Längenproblem jedenfalls lösen. inline reagiert tatsächlich auf Breitenangaben nicht. Schönen Gruß, 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@lists.typo3.org http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german ___ TYPO3-german mailing list TYPO3-german@lists.typo3.org http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
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: pe...@function2form.net
To: typo3-german@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@lists.typo3.org
http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
___
TYPO3-german mailing list
TYPO3-german@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@lists.typo3.org
http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
Re: [TYPO3-german] Einfaches Problem: Horizontales Navi
Hallo Peter
wozu ... mit
div#navigation li {display:inline}
gehts doch genauso. Alain hat einfach übersehen, dass er display:inline nicht
auf li (= Listeneintrag) sondern auf li a (= Link im Listeneintrag) angewendet
hat. Letzteres funktioniert natürlich nicht.
Gruß
Peter
Am 25.06.2012 um 15:07 schrieb Peter Kühnlein:
Scusi... hat etwas gedauert...
1.NO.linkWrap = li class=naviitem | /li
würde eine Klasse an die li-Elemente anfügen. Dann kannst du's im CSS als
display:inline-block; definieren. Oder du läßt's, wie's ist, und setzt im CSS
eine Definition für ul.navi li ... ist eigentlich wurscht.
Schöne Grüße,
Peter
Am 25.06.2012 13:56, schrieb level R:
Wie muss ich denn den Typoscriptcode anpassen?Diesen Teil weglassen, wuerde
ja das ganze Menue unsichtbar machen.
Natuerlich brauche ich keinen fertigen Code; ein Hinweis wuerde genuegen
Date: Mon, 25 Jun 2012 13:50:15 +0200
From: pe...@function2form.net
To: typo3-german@lists.typo3.org
Subject: Re: [TYPO3-german] FW: Einfaches Problem: Horizontales Navi
Am 25.06.2012 13:47, schrieb level R:
Hallo Kai
Danke fuer den Tipp.Ich habe die Navigation schrittweise bis 900px
vergroessert. Solang display: block;steht, kann man sehen, dass es mehr
Platz beansprucht;
aber sobald dadisplay: inline;oderdisplay: inline-block;steht, braucht es
nur so viel Platz, wie das Wort lang ist...
Uebrigens:
UnterDatei Template info/Bearbeiten Setuphabe ich folgenden
Typoscripteintrag:
marks.NAVIGATION = HMENU
marks.NAVIGATION {
wrap = ul class=navi | /ul
1 = TMENU
1.NO.linkWrap = li | /li
}
Hat es damit etwas zu tun, dass es nicht funktioniert?
Gruss,Alain
--
http://function2form.net
http://peter-kuehnlein.net
To face an event and solve it lightly is difficult if you are not resolved
beforehand, and there will always be uncertainty in hitting your mark.
(Hagakure)
___
TYPO3-german mailing list
TYPO3-german@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@lists.typo3.org
http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
Re: [TYPO3-german] Einfaches Problem: Horizontales Navi
Hallo auch Peter :)
das ist doch in etwa meine zweite Lösung... ob man nun div#navigation li
(macht eigentlich div#navigation Sinn? # referiert ja auf eine id...)
nimmt oder ul.navi li ...
Schöne Grüße,
Peter
Am 25.06.2012 15:10, schrieb Peter Linzenkirchner:
Hallo Peter
wozu ... mit
div#navigation li {display:inline}
gehts doch genauso. Alain hat einfach übersehen, dass er display:inline nicht
auf li (= Listeneintrag) sondern auf li a (= Link im Listeneintrag) angewendet
hat. Letzteres funktioniert natürlich nicht.
Gruß
Peter
Am 25.06.2012 um 15:07 schrieb Peter Kühnlein:
Scusi... hat etwas gedauert...
1.NO.linkWrap = li class=naviitem | /li
würde eine Klasse an die li-Elemente anfügen. Dann kannst du's im CSS als
display:inline-block; definieren. Oder du läßt's, wie's ist, und setzt im CSS
eine Definition für ul.navi li ... ist eigentlich wurscht.
Schöne Grüße,
Peter
--
http://function2form.net
http://peter-kuehnlein.net
To face an event and solve it lightly is difficult if you are not resolved
beforehand, and there will always be uncertainty in hitting your mark.
(Hagakure)
___
TYPO3-german mailing list
TYPO3-german@lists.typo3.org
http://lists.typo3.org/cgi-bin/mailman/listinfo/typo3-german
