Bild in der Galerie ansprechen.

[myoddo]

In meiner Bildergalerie möchte ich das letzte Bild groß anzeigen lassen (340px)
Ich dachte mir ich gebe dem letzten Bild eine class und setze diese auf 340px.
Leider lässt sich die class nicht ansprechen.
Welchen Fehler habe ich ? Habt ihr eine bessere Lösung?

<ul id="galleryh">
               <li>             
                 <a href="pictures/vorg-01-600.jpg" rel="lightbox[roadtrip]" alt=""> 
                 <img src="pictures/vorg-01-320.jpg" alt="Vorgarten von Hug" boarder="0"width="320" height="240"                /></a></li>
 

                <li>             
                <a href="pictures/vorg-02-600.jpg" rel="lightbox[roadtrip]" alt="">
                   <img src="pictures/vorg-02-320.jpg" alt="Vorgarten von Hug" width="320" height="240" /></a><li>
                
                  <li>             
                <a href="pictures/vorg-04-600.jpg" rel="lightbox[roadtrip]" alt="">
                   <img src="pictures/vorg-04-320.jpg" alt="Vorgarten von Hug" width="320" height="240" /></a><li>

                <li>             
                <a href="pictures/vorg-06-600.jpg" rel="lightbox[roadtrip]" alt="">
                   <img src="pictures/vorg-06-320.jpg" alt="Vorgarten von Hug" width="320" height="240" /></a></li>
                           
                

                <li>             
                <a href="pictures/vorg-09-600.jpg" rel="lightbox[roadtrip]" alt="">
                   <img src="pictures/vorg-09-320.jpg" alt="Vorgarten von Hug" width="320" height="240" /></a></li>
    
                <!-- dieses Bild soll Groß 340px werden -->
                 <li class="bild_big">
                <a href="pictures/vorg-08-600.jpg" rel="lightbox[roadtrip]" alt="">
                   <img src="pictures/vorg-08-320.jpg" alt="Vorgarten von Hug" width="320" height="240" /></a>
                </li>
                 

            </ul>

#galerie01 #galerie02, h2  {

                         text-align:center;
                         color:#543708;

                         }

#galerie01 #galerie02, h3  
                        {
                         text-align:center;
                         color:#543708;
                         margin-top:15px;
                         }
#gallery2 {
            width: 585px;
            height: 242px;
            padding: 5px;  /*Rahmen um Galerie*/
            border: 1px solid #fff;
            margin-top: 20px;
            margin-right: 0px;
            margin-bottom: 50px;
            margin-left: 0px;
            background-color: #543708; /*Rahmenfarbe*/
            -moz-border-radius:4px; /* Firefox */
            -webkit-border-radius:4px; /* Safari, Chrome */
            -khtml-border-radius:4px; /* Konqueror */
            border-radius:4px; /* CSS3 */          
          }
#galleryh {

  list-style-type:none;
  overflow:hidden;
  width: 583px;
  height:240px;

  border:1px solid #888;
  background:#FFF ;
  }
#galleryh li { float: left;
         margin-left:1px;
                         }

#galleryh li a {
  display:block;
  height:240px;
  width:38px;    /*breite Bilder (geschlossen) */
  float:left;
  text-decoration:none;
  border-right:1px solid #FFF;
  cursor:default;
  }
#galleryh li a img {
  width:38px;    /*breite Bilder (geschlossen) */
  height:240px;
  border:0px ;
  margin:0px;
  

  }
#galleryh li a:hover {
  background:#eee;
  width:320px;
  }
#galleryh li a:hover img {
  width:320px;
  }


#galleryh li .bild_big a img {
  width:340px;    /* hier wollte ich das Bild auf 340px setzen  */

Danke für Eure Hilfe !

 

[threadi]

Du hast ein Leerzeichen zuviel in

#galleryh li .bild_big a img

Müsste eigentlich so lauten:

#galleryh li.bild_big a img

da die Klasse ja am <li> hängt und nicht an irgendeinem darin befindlichen Element.

 

[djheke]

#galleryh li.bild_big img {
  width:340px;   
}

einfach das leerzeichen entfernen.

wieder zuspät

 

[myoddo]

Danke

So simpel !!
Lieber später als nie !!
Dickes Danke an Euch.