Joey, mein Retter :)
Besten Dank für deine Mithilfe. Die Darstellung passt jetzt auf jeden Fall.
Aber bedauerlicherweise ist keiner der Links anklickbar. Es erscheint nur die
Grafik. Das ist natürlich optisch tolerierbar, aber nicht funktionell :(
-----Ursprüngliche Nachricht-----
Von: typo3-german-boun...@lists.typo3.org im Auftrag von JoH asenau
Gesendet: Sa 25.9.2010 10:23
An: typo3-german@lists.typo3.org
Betreff: [TYPO3-german] Re: Menü mit Bildern statt GMENU oder Textmenü
> #manufacturers li
> {
> display: inline;
> }
>
> #manufacturers li a
> {
> display: block;
> }
>
> #manufacturers li a span
> {
> /* margin-top: 100px; */
> }
Das kann so nicht funktionieren, weil
a) das display:inline der li-tags vom display:block der a-tags aufgehoben wird
(die Kacheln stehen also untereinander)
und b) der Text natürlich mitten in den a-tags steht, weil Du den im span-tag
bisher nicht verschiebst
Ohne float oder zumindest display:inline-block wirst Du da nicht weiter kommen.
Letzteres klappt aber im IE nur für Elemente, die per Default vom Typ "inline"
sind.
li {
display:block;
float:left;
}
a {
display:block;
width:62px;
height:62px;
overflow:hidden;
}
span {
line-height:1000px;
}
Das sollte eigentlich reichen. Die Hintergründe sollten dann ins a-tag, dann
kannst Du sogar ohne spezielle Hacks ein hover bis runter zum IE6 realisieren:
entweder mit zwei Bildern
.kachel1 a {
background:url(../whatever/blah.jpg) no-repeat top left;
}
.kachel1 a:hover {
background:url(../whatever/blah_over.jpg) no-repeat top left;
}
oder mit nur einem Bild:
.kachel1 a {
background:url(../whatever/blah.jpg) no-repeat;
background-position: top left;
}
.kachel1 a:hover {
background-position: bottom left;
}
HTH
Joey
PS: Sowas findest Du aber eigentlich als Mini-Tutorial an jeder dritten Ecke
im Web ;-)
--
Wenn man keine Ahnung hat: Einfach mal Fresse halten!
(If you have no clues: simply shut your gob sometimes!)
Dieter Nuhr, German comedian
Xing: http://contact.cybercraft.de
Twitter: http://twitter.com/bunnyfield
TYPO3 cookbook (2nd edition): http://www.typo3experts.com
_______________________________________________
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
