Susanne Hugo: Problem bei der Formatierung von Liste

Hallo,
ich habe ein Problem mit dem class attribut meiner Liste:

<ul>
    <li><a title="Meine Arbeit als Synchron-Sprecherin" href="#Stimme">STIMME</a>
    <li><a class="ca" title="Dorette h&ouml;ren im MP3-Format" href="hoerproben.html">Stimmproben</a>
    <li><a class="ca" title="Meine Stimme in Kinofilmen" href="sprechrollenfilme.html">im Kino</a>
    <li><a class="ca" title="Meine Stimme in Fernsehserien" href="sprechrollenserien.html">in Serien</a>
    <li><a class="ca" title="Meine Stimme in H&ouml;rspielen" href="hoerspiele.html">in H&ouml;rspielen</a>
   </ul>
CSS:
#navigation a.ca
   { color: inherit; line-height: normal; background: #f60; display: block; margin: -5px 0 0; padding: 3px 4px 3px 20px; border-top: medium none }

Die Klassenzuweisung funktioniert nur bei den lertzten drei li Elementen.
Kann mir jemand helfen und erklären warum das so ist?

Vielen Dank Susanne

  1. Hallo,
    ich habe ein Problem mit dem class attribut meiner Liste:

    <ul>
        <li><a title="Meine Arbeit als Synchron-Sprecherin" href="#Stimme">STIMME</a>
        <li><a class="ca" title="Dorette h&ouml;ren im MP3-Format" href="hoerproben.html">Stimmproben</a>
        <li><a class="ca" title="Meine Stimme in Kinofilmen" href="sprechrollenfilme.html">im Kino</a>
        <li><a class="ca" title="Meine Stimme in Fernsehserien" href="sprechrollenserien.html">in Serien</a>
        <li><a class="ca" title="Meine Stimme in H&ouml;rspielen" href="hoerspiele.html">in H&ouml;rspielen</a>
       </ul>
    CSS:
    #navigation a.ca
       { color: inherit; line-height: normal; background: #f60; display: block; margin: -5px 0 0; padding: 3px 4px 3px 20px; border-top: medium none }

    Die Klassenzuweisung funktioniert nur bei den lertzten drei li Elementen.
    Kann mir jemand helfen und erklären warum das so ist?

    Vielen Dank Susanne

    Hallo Susanne,

    folgendes funktioniert bei mir:

      
    <html>  
    <head>  
      
    <style type="text/css">  
    .ca  
       { color: inherit; line-height: normal; background: #f60; display: block; margin: -5px 0 0; padding: 3px 4px 3px 20px; border-top: medium none }  
    </style>  
      
    </head><body>  
      
    <ul>  
        <li><a title="Meine Arbeit als Synchron-Sprecherin" href="#Stimme">STIMME</a>  
        <li><a class="ca" title="Dorette h&ouml;ren im MP3-Format" href="hoerproben.html">Stimmproben</a>  
        <li><a class="ca" title="Meine Stimme in Kinofilmen" href="sprechrollenfilme.html">im Kino</a>  
        <li><a class="ca" title="Meine Stimme in Fernsehserien" href="sprechrollenserien.html">in Serien</a>  
        <li><a class="ca" title="Meine Stimme in H&ouml;rspielen" href="hoerspiele.html">in H&ouml;rspielen</a>  
       </ul>  
      
    </body></html>  
    
    

    Das Problem war bei deiner CSS-Zuweisung zu finden:

    #navigation a.ca

    #navigation ist eine Id, die in deinem Code nicht vorhanden ist.
    a spricht einen link an und .ca spricht links an die die class ca gesetzt haben.

    GodLike

    1. Hallo GodLike

      Hallo Susanne,

      folgendes funktioniert bei mir:
      [code lang=html]
      <html>
      <head>

      <style type="text/css">
      .ca
         { color: inherit; line-height: normal; background: #f60; display: block; margin: -5px 0 0; padding: 3px 4px 3px 20px; border-top: medium none }
      </style>

      Das habe ich ausprobiert, im Explorer genau das gleiche wie vorher, drei von vier Zuweisungen funktionieren; bei Netscape und Firefox ist der optische Effekt wie gewünscht, aber die links mit der Zuweisung .ca werden übersprungen.

      Ich glaube, ich gebe auf und versuche etwas weniger schickes, was dafür aber funktioniert.

      Vielen Dank für deine Hilfe.
      Gruß, Susanne

  2. Hallo,
    auch unter zuhilfenahme deines letzten Eintrags (mit der eindeutigen ID für die Navigation) finde ich nichts, dass ein Problem darstellen sollte.
    Allerdings würde ich dir dringend raten deinen Code mit allen gängigen Browsern zu testen, da zum Beispiel Opera etwas völlig anderes liefert als der Internet Explorer.

    Auch funktionieren bei mir alle Menüpunkte deiner Webseite. Es müsste also an etwas anderem liegen.

    1. Hallo,
      auch unter zuhilfenahme deines letzten Eintrags (mit der eindeutigen ID für die Navigation) finde ich nichts, dass ein Problem darstellen sollte.
      Allerdings würde ich dir dringend raten deinen Code mit allen gängigen Browsern zu testen, da zum Beispiel Opera etwas völlig anderes liefert als der Internet Explorer.

      Auch funktionieren bei mir alle Menüpunkte deiner Webseite. Es müsste also an etwas anderem liegen.

      Hallo Rafael,
      danke dass du nachgesehen hast. Inhaltlich ist ja auch alles klar, nur die optische Gestaltung funktioniert eben nicht wie gewünscht, in keinem getesten browser. Trotzdem danke.
      Gruß, Susanne

  3. Hallo Susanne,

    ich habe ein Problem mit dem class attribut meiner Liste:

    und warum fängst du dann gleich wieder einen neuen Thread an, wo doch dein gestriger Thread zum gleichen Thema noch vor aller Augen prangt?

    Bitte vermeide solche Doppelpostings; sie erschweren den Helfern den Überblick und reißen Zusammenhänge auseinander.

    So long,
     Martin

    --
    Computer lösen für uns Probleme, die wir ohne sie gar nicht hätten.
    1. Hallo Susanne,

      ich habe ein Problem mit dem class attribut meiner Liste:

      und warum fängst du dann gleich wieder einen neuen Thread an, wo doch dein gestriger Thread zum gleichen Thema noch vor aller Augen prangt?

      Bitte vermeide solche Doppelpostings; sie erschweren den Helfern den Überblick und reißen Zusammenhänge auseinander.

      So long,
      Martin

      Hallo Martin,

      da habe ich die mail von Rafael falsch verstanden. Ich hätte die Frage wohl besser unter dem alten Punkt neu formuliert. Tut mir leid, wird nicht wieder vorkommen.
      Gruß, Susanne