Gunther: css reihenfolge

Beitrag lesen

Hallo!

Bitte benutze die entsprechenden Möglichkeiten der Code-Auszeichnung hier im Forum.

body {  
  font-size:           small;  
  font-family:         Verdana, Helvetica, Arial, sans-serif;  
  line-height:         1.6em;  
}  
  
h1, h2 {  
  color:               #007e7e;  
}  
  
h1 {  
  font-size:           150%;  
}  
  
h2 {  
  font-size:           130%;  
}  
#erstaunlich {  
	width: 200px;  
  
}  
.garantie {  
  font:				   small/1.6em Verdana, Helvetica, Arial, sans-serif;  
  color:               #444444;  
  border:			   white dashed 1px;  
  background-color:    #a7cece;  
  padding:             25px;  
  padding-left:        80px;  
  margin:              30px;  
  margin-right:        250px;  
  white url(bilder/hintergrund.gif) repeat-x;  
}  
  
#fusszeile {  
   font: 			  small/1.6em center green Verdana,Helvetica, sans-serif;  
   margin:			  30px 0 0 0 ;  
   }  
  
  
#elixire {  
   float: right;  
   line-height: 1.7;  
   border-width: thin;  
   border-style: solid;  
   border-color: #007e7e;  
   width: 200px;  
  
   padding: 0 20px 20px 20px;  
  
   margin: 0 0 0 20px;  
  
   text-align: center;  
  
   background-image: url(bilder/cocktail.gif);  
   background-repeat: repeat-X;  
  
}  
  
#elixire h2 {  
   color: black;  
  
}  
  
#elixire h3 {  
  color:  #f00;  
}  
  
#elixire a:link {  
	color: #007e7e;  
}  
  
#elixire a:visited {  
	color: #333;  
}  
  
#elixiere a:hover {  
	background: #f88396;  
	color: #0d5353;  
  
  
  
  
.cd {  
	font-style: italic;  
}  
  
.interpret {  
	font-weight: bold;  
}  
  
a:link {  
	color: #0f0;  
}  
  
a:visited {  
	color: #f00;  
}  
  
a:hover {  
	color: yellow;  
}

CSS macht nur "Sinn", wenn man den dazugehörigen HTML-Code ebenfalls kennt/ sehen kann.

Nach deiner bisherigen Beschreibung dürfte es keine Rolle spielen, an welcher Stelle in der CSS-Datei du diese Regel notierst.

Wenn du allerdings "Fehler" (Syntax) in deine CSS-Datei einbaust, dann kann es passieren, dass nachfolgende Styles vom Browser "nicht erkannt/ angewendet" werden.

So z.B. der Fall bei:

  
.garantie {  
  font:           small/1.6em Verdana, Helvetica, Arial, sans-serif;  
  color:               #444444;  
  border:         white dashed 1px;  
  background-color:    #a7cece;  
  padding:             25px;  
  padding-left:        80px;  
  margin:              30px;  
  margin-right:        250px;  
  white url(bilder/hintergrund.gif) repeat-x;  
}

Und bei

  
#elixiere a:hover {  
  background: #f88396;  
  color: #0d5353;  

Wenn du diese Fehler behoben hast, wirst du sehen, dass es für deinen Fall egal ist, wo die Regel steht.

Trotzdem sind die Kaskade und die Spezifität zwei elementare Bestandteile von CSS, weshalb sich das Studium der von Matthias verlinkten Seiten auf jeden Fall lohnt.

Gruß Gunther