Anzeige

CSS funzt nicht

CSS funzt nicht | PSD-Tutorials.de

Erstellt von 0816_Ghost, 15.11.2005.

  1. 0816_Ghost

    0816_Ghost Nicht mehr ganz neu hier

    Dabei seit:
    14.10.2005
    Beiträge:
    114
    Geschlecht:
    männlich
    Ort:
    Schweiz - Luzern
    CSS funzt nicht
    Hallo Leute,

    Wer kann mir helfen. Ich möchte ein CSS-basierten Rolloverbtn machen. www.glogghuis.ch/0816 . Nun funktioniert es aber nicht richtig und beim Link, bzw. Rollover wird das Hintergrundbild nur auf den Text angewendet und nicht die ganze Zelle. Kann mir jemand helfen? Die CSS-Datei findet sich unter www.glogghuis.ch/0816/css/basic.css

    So wie dies hier, einfach nicht animiert, sondern als rollover:

    [​IMG]

    Vielen, vielen Dank an alle, die mir weiterhelfen können.

    Greez,

    Edit: Ach ja, hab noch vergessen zu erwähnen, dass das Wort "Test" eigentlich im Rahmen links davon sein sollte!! Please help me. Möchte das so gerne mit CSS lösen und nicht mit normalem rollover...

    Ghost
     
    #1      
  2. Stroker

    Stroker Guest

    CSS funzt nicht
    Also erstmal hast du im CSS geschrieben ".MenuTitle A:link", aber die Klasse MenuTitle, welche du <A> zugewiesen hast, auf <TD> angewendet.

    Mein Vorschlag, wobei ich nicht weis ob das geht. Mache zwei Hintergründe für den Button und schreibe bei A:link rein, dass CSS den ersten HG nehmen soll und bei A:hover den zweiten HG.
     
    #2      
  3. 0816_Ghost

    0816_Ghost Nicht mehr ganz neu hier

    Dabei seit:
    14.10.2005
    Beiträge:
    114
    Geschlecht:
    männlich
    Ort:
    Schweiz - Luzern
    CSS funzt nicht
    Auf was muss ich es denn anwenden, wenn nicht auf <Td> und das mit dem HG habe ich eigentlich gemacht. Aber die Grafik wird immer viel zu klein dargestellt (gerade mal auf die Grösse des Textes). Bin echt am verzweifeln. Habe schon x-Tuts und dergleichen durchgemacht, aber irgendwie scheint das bei mir nicht zu fruchten... *grosse Verzweiflung*

    Hier mein Quelltext (extern) für das CSS:

    .MenuTitle a { color: #ffc; font-size: 14px; font-family: Arial, Verdana, Arial, Tahoma; font-style: normal; font-weight: bold; line-height: 25px; background-image: url(../images/header/menu-basis.gif); background-repeat: no-repeat; text-align: center; width: 100%; height: 100%; }

    .MenuTitle a:link { color: #ffc; font-size: 14px; font-family: Arial, Verdana, Arial, Tahoma; text-decoration: none; font-style: normal; font-weight: bold; line-height: 25px; background-image: url(../images/header/menu-basis.gif); background-repeat: no-repeat; text-align: center; width: 100%; height: 100% ; }

    .MenuTitle a:hover { color: #960; font-size: 14px; font-family: Arial, Verdana, Arial, Tahoma; font-style: normal; font-weight: bold; line-height: 25px; background-image: url(../images/header/menu-basis-over.gif); background-repeat: no-repeat; text-align: center; width: 100%; height: 100% ; }

    Greez, Ghost
     
    #3      
  4. Stroker

    Stroker Guest

    CSS funzt nicht
    Wende es direkt auf <A> an, weil du hast ja festgelegt, dass alle Elemente von <A>, welche die Klasse MenuTitle haben, diese Eigenschaften erhalten, da bringt es nichts es ins Element <TD> zuschreiben, dass ignoriert die Angaben einfach und schreibe bei dem Hintergrund nicht 100%, sondern die genaue größe in Pixel, also width 120px und height 60px z.B.. Kann sein das ich es übersehen habe, aber vllt noch background-postion: center; setzen.
     
    #4      
  5. 0816_Ghost

    0816_Ghost Nicht mehr ganz neu hier

    Dabei seit:
    14.10.2005
    Beiträge:
    114
    Geschlecht:
    männlich
    Ort:
    Schweiz - Luzern
    CSS funzt nicht
    Habe es auf <a> angewendet und die Grösse eingestellt, dann geht aber gar nichts mehr ist wirklich verhext... das kann doch nicht so schwer sein...

    Aber vielen Dank für deine Hilfe,

    Ghost
     
    #5      
  6. Kaikashi

    Kaikashi Freak

    Dabei seit:
    20.04.2005
    Beiträge:
    46
    Geschlecht:
    männlich
    Software:
    Gimp, Inkskape, Alchemy, Blender, Eclipse
    Kameratyp:
    Mein Kopf ;-)
    CSS funzt nicht
    Also ich kann den Fehler auch nicht Finden. Aber hier n vorschlag, wie ich es schreiben würde: (ich lass den gansen Grimskrams weg...)

    aslo in die css-datei
    a:link {background-image:url('bgnorm.gif')}
    a:hover {background-image:url('bghove.gif')}

    und dann einfach noch die links machen...
     
    #6      
  7. Askalon

    Askalon Aktives Mitglied

    Dabei seit:
    20.12.2004
    Beiträge:
    312
    Ort:
    München
    CSS funzt nicht
    HI
    was für ein Quelltext!!

    hast du schonmal was von Vererbung gehört?

    Den Quelltext kann man auf ein zehntel kürzen.

    alleine in so einer Zeile:
    Code (Text):
    1.  
    2. .fliesstxt   { color: #333333; font-size: 11px; font-family: Arial, Verdana, Arial, Tahoma; font-style: normal; font-weight: normal; line-height: 14px; text-decoration: none ; }
    wird gekürzt:
    Code (Text):
    1.  
    2. .fliesstxt {   #333 11px 14px Arial, Verdana, Tahoma, sans-serif;
    3.                  text-decoration: none;}
    4.  
    das Sans Serif ist wichtig damit es auf Linux und mac PC richtige Schriftart angezeigt wird.
    Auf dennen gibts nunmal keine Arial, Verdana und Tahoma
    Und durch sinnvolle Vererbung ist noch viel mehr gespart.

    gruss
     
    #7      
  8. Kaikashi

    Kaikashi Freak

    Dabei seit:
    20.04.2005
    Beiträge:
    46
    Geschlecht:
    männlich
    Software:
    Gimp, Inkskape, Alchemy, Blender, Eclipse
    Kameratyp:
    Mein Kopf ;-)
    CSS funzt nicht
    Also dass was ich geschrieben hab funtzt nich.. komisch hab mir mal den quellcode von ner seite mit ähnlichem effekt durchgeschaut und ausprobiert und funtzt trotzdem nich..
     
    #8      
  9. 0816_Ghost

    0816_Ghost Nicht mehr ganz neu hier

    Dabei seit:
    14.10.2005
    Beiträge:
    114
    Geschlecht:
    männlich
    Ort:
    Schweiz - Luzern
    CSS funzt nicht
    Hi Leute,

    Herzlichen Dank für eure Bemühungen. Hab es zum laufen gebracht mit viel probieren, usw.

    @Askalon: Vielen Dank für deinen Tipp. Beschäftige mich noch nicht so lange mit CSS und bin daher über jede Hilfe und Kritik dankbar. Kannst du mir das ganze noch etwas detaillierter erklären; bzw. was wird vererbt und was nicht?

    Jedenfalls vielen Dank und noch einen schönen Abend,

    Gruss,

    Ghost

    Quelltext geht nun so:

    .MenuTitle a { color: #ffc; font-size: 14px; font-family: Arial, Verdana, Arial, Tahoma, sans-serif; font-style: normal; font-weight: bold; line-height: 25px; background-image: url(../images/header/menu-basis.gif); background-repeat: no-repeat; background-position: center 0; text-align: center; width: 100px; height: 25px; visibility: visible; float: left; clear: right; }

    Aber wie gesagt: Von vererben hab ich noch nichts gehört, bzw. noch keine Ahnung. Bitte, bitte für Newcomer in Sachen CSS erklären, thx
     
    #9      
  10. Kaikashi

    Kaikashi Freak

    Dabei seit:
    20.04.2005
    Beiträge:
    46
    Geschlecht:
    männlich
    Software:
    Gimp, Inkskape, Alchemy, Blender, Eclipse
    Kameratyp:
    Mein Kopf ;-)
    CSS funzt nicht
    Code (Text):
    1.  
    2. .navi {background-image:url('menu-basis.gif'); width:100px;text-align:center; padding-top:5px; display:block;height:20px;text-decoration: none; font:bold 11px tahoma;}
    3. .navi:hover {background-image:url('menu-basis-over.gif'); width:100px;text-align:center; padding-top:5px; display:block;height:20px;text-decoration: none; font:bold 11px tahoma;}
    Is auchn Weg zum Ziel... mensch wollte es gerade Posten und dann les ich deine Antwort mist
     
    #10      
  11. Askalon

    Askalon Aktives Mitglied

    Dabei seit:
    20.12.2004
    Beiträge:
    312
    Ort:
    München
  12. Stroker

    Stroker Guest

    CSS funzt nicht
    Hier ist noch ein Tutorial. 132 Seiten pdf, was man schön offline lesen kann, ich finde es spitze.
     
    #12      
  13. 0816_Ghost

    0816_Ghost Nicht mehr ganz neu hier

    Dabei seit:
    14.10.2005
    Beiträge:
    114
    Geschlecht:
    männlich
    Ort:
    Schweiz - Luzern
    CSS funzt nicht
    Vielen lieben Dank, ihr seid spitze. Habe mir das PDF heruntergeladen und werde es mir demnächst zu gemüte ziehen. Bin einfach zur Zeit etwas gar überlastet, so ungefähr 150% Pensum. Ich muss aber schon bald zum Bund und da hat man erfahrungsgemäss jede Menge Zeit....

    Greez,

    Ghost
     
    #13      
x
×
×