zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden A:hover Angaben werden nicht übernommen

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 02.07.2006, 20:52
das müllheld
neuer user
Thread-Ersteller
 
Registriert seit: 15.12.2005
Ort: Saarbrücken
Beiträge: 52
trashhero befindet sich auf einem aufstrebenden Ast
Frage A:hover Angaben werden nicht übernommen

Hi,
leider wird die Angabe "a:hover { color:...}" nicht übernommen. Die Angabe "background" aber schon.

CSS:
Code:
/* Allgemeines */
* {
	margin: 0;
	padding: 0;
	}
body {
	text-align: center;
	font-size: 16px;
	font-family: Verdana, Arial;
	}
ul {
	list-style: circle inside;
	}
img {
	behavior: url("pngbehavior.htc");
	border: 0;
}
/* Header */
#header {
	height: 110px;
	background: #2B8A06 url(images/background.jpg);
	}
/* Navigation */
ul#navigation li {
	display: inline;
	}
ul#navigation a {
	border-left: 2px solid #000;
	border-right: 2px solid #000;
	padding: 0 5px 0 5px;
	margin: 0 15px 0 0;
	text-decoration: none;
	color: #fff;
	background: #5DA500 url(images/background.jpg) 0 -40px;
	}
ul#navigation a:hover {
	color: #000;
	background: #fff;
	}
ul#navigation {
	border-top: 2px solid #000;
	border-bottom: 2px solid #000;
	background: #555 url(images/navigation.jpg);
	font: 1.3em Georgia, Arial;
	font-size: 1.3em;
	text-align: center;
	}
/* Content */
#content {
	width: 64%;
	float: left;
	text-align: left;
	border-right: 2px solid #498706;
	color: #333;
	}
#content, #sidebar {
	font: 0.8em Verdana, Arial;
	}
#content p {
	margin: 5px 0 0 0;
	}
/* Postneu */
.postneu {
	background: #5DAE07;
	padding: 5px;
	border-bottom: 5px solid #498706;
	color: #fff;
	margin: 0 0 15px 0;
	}
.postneu h2 {
	background: #F6AD00;
	}
.postneu .meta {
	margin: 2px 0 10px 0;
	font-size: 0.9em;
	color: #F6AD00;
	}
.postneu .meta img, .post .meta img {
	margin: 0 3px 0 0;
	}
.postneu a {
	color: #fff;
	text-decoration: underline;
	}
.postneu .postcontent, .postneu .meta {
	border-bottom: 1px solid #498706;
	}
.postneu #neu {
	float: right;
	height: 50px;
	width: 50px;
	}
/* Post */
.post .meta {
	margin: 2px 0 10px 0;
	font-size: 0.9em;
	}
.post .postcontent, .post .meta {
	border-bottom: 1px solid #5DAE07;
	}
.post {
	padding: 5px;
	border-bottom: 1px solid #000;
	margin: 0 0 15px 0;
	}
.post h2 {
	color: #5DAE07;
	}
.post a {
	color: #5DAE07;
	text-decoration: underline;
	}
.post a:visited {
	color: #000;
	}
.post .meta {
	color: #5DAE07;
	}
/* Sidebar */
#sidebar {
	background: #555 url(images/sidebar.jpg) repeat-x left bottom;
	width: 34%;
	border-left: 2px solid #000;
	float: right;
	text-align: left;
	color: #fff;
	padding: 5px 0;
	}
#sidebar p {
	margin: 5px;
	}
#sidebar h3 {
	font: bold 1.2em Trebuchet MS, Arial;
	color: #5DAE07;
	margin: 5px 0 0 5px;
	}
#sidebar a {
	color: #fff;
	}
#sidebar a:hover {
	color: #5DAE07;
	}
#footer {
	border-top: 1px dotted #fff;
	margin: 10px 0 0 0;
	text-align: center;
	}
ul.liste {
	list-style: none;
	border-top: 1px solid #393939;
	margin: 0 0 0 5px;
	}
ul.liste li {
	display: inline; /* Keine ungewünschten Abstände im IE zwischen den Elementen */
	}
ul.liste a {
	background: url(images/kateg.jpg) repeat-x;
	padding: 2px;
	border: 1px solid #393939;
	border-right: 0;
	border-top: 0;
	display: block;
	text-decoration: none;
	}
ul.liste a:hover {
	background: #5DAE07 url(images/kateghover.jpg) repeat-x;
	color: #fff;
	}
ul#feeds {
	list-style: url(images/feedicon.png) inside;
	margin: 0 0 0 5px;
	}
#metainfo {
	background: #5DAE07;
	border: 2px solid #000;
	border-left: 0;
	border-right: 0;
	padding: 5px;
	}
#metainfo h3 {
	color: #fff;
	margin: 0 0 0 3px;
	}
/* Kommentare */
ul#commentlist li {
	background: #5DAE07;
	border: 2px solid #498706;
	border-left: 0;
	border-right: 0;
	padding: 5px;
	}
ul#commentlist li:hover {
	background: #5DAE07 url(images/comment.jpg) no-repeat;
	}
ul#commentlist {
	list-style: none;
	}
ul#commentlist h4 {
	margin: 0 0 0 3px;
	font: bold 1.2em Verdana;
	}
ul#commentlist .commentmeta {
	font-size: 0.8em;
	}
ul#commentlist a:hover {
	color: #000;
	}
HTML:
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de" >
<head>
<title>X-Tream Lan, die Lan der Klasse 10c</title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" type="text/css" href="format.css" />
</head>
<body>
<div id="header">
 <h1><img src="images/logo.jpg" alt="X-Tream Lan" /></h1>
</div>
<ul id="navigation">
 <li><a href="#">Startseite</a></li>
 <li><a href="#">Archiv</a></li>
 <li><a href="#">Bilder</a></li>
 <li><a href="#">Forum</a></li>
 <li><a href="#">Impressum</a></li>
</ul>
<div id="content">
 <div class="postneu">
  <img src="images/neu.png" alt="NEU!" id="neu" />
  <h2>Neues Design</h2>
  <div class="meta">
   <img src="images/autor.gif" alt="Autor:" />Fritz | <img src="images/datum.gif" alt="Datum" />3.Juni 2006
  </div>
  <div class="postcontent">
  <p>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Proin diam quam, aliquet ac, dignissim non, dictum in, quam. Pellentesque accumsan viverra orci. Aliquam erat volutpat. Curabitur euismod leo a justo. Nullam mattis nunc. Morbi vel purus id orci ornare ultricies. Sed et diam id nibh pretium posuere. Vivamus molestie velit vel magna. Donec sapien. Curabitur imperdiet bibendum dui. Donec id ante. Nunc tristique nisl id nisl. Vivamus ac erat dignissim enim congue elementum. Quisque imperdiet pede et velit. Fusce consequat. Morbi lacus leo, tristique pellentesque, imperdiet pretium, viverra vitae, lorem. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Suspendisse ac massa sit amet lacus laoreet accumsan. Nunc magna. Praesent cursus lorem at tortor.
</p>
 <p>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Proin diam quam, aliquet ac, dignissim non, dictum in, quam. Pellentesque accumsan viverra orci. Aliquam erat volutpat. Curabitur euismod leo a justo. Nullam mattis nunc. Morbi vel purus id orci ornare ultricies. Sed et diam id nibh pretium posuere. Vivamus molestie velit vel magna. Donec sapien. Curabitur imperdiet bibendum dui. Donec id ante. Nunc tristique nisl id nisl. Vivamus ac erat dignissim enim congue elementum. Quisque imperdiet pede et velit. Fusce consequat. Morbi lacus leo, tristique pellentesque, imperdiet pretium, viverra vitae, lorem. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Suspendisse ac massa sit amet lacus laoreet accumsan. Nunc magna. Praesent cursus lorem at tortor.
</p>
  </div>
  <a href="#">>> Alles lesen?</a>
 </div>
 <div class="post">
  <h2>Nächste Lan in Planung</h2>
  <div class="meta">
   <img src="images/autor.gif" alt="Autor:" />Lukas | <img src="images/datum.gif" alt="Datum" />4.Juni 2006
  </div>
  <div class="postcontent">
  <p>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. <a href="http://google.de">Proin</a> diam quam, aliquet ac, dignissim non, dictum in, quam. Pellentesque accumsan viverra orci. Aliquam erat volutpat. Curabitur euismod leo a justo. Nullam mattis nunc. Morbi vel purus id orci ornare ultricies. Sed et diam id nibh pretium posuere. Vivamus molestie velit vel magna. Donec sapien. Curabitur imperdiet bibendum dui. Donec id ante. Nunc tristique nisl id nisl. Vivamus ac erat dignissim enim congue elementum. Quisque imperdiet pede et velit. Fusce consequat. Morbi lacus leo, tristique pellentesque, imperdiet pretium, viverra vitae, lorem. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Suspendisse ac massa sit amet lacus laoreet accumsan. Nunc magna. Praesent cursus lorem at tortor.
</p>
  </div>
  <a href="#">>> Alles lesen?</a>
 </div>
</div>
<div id="sidebar">
 <h3>Feeds</h3>
 <ul id="feeds">
  <li><a href="#">RSS Feed Beiträge</a></li>
  <li><a href="#">RSS Feed Kommentare</a></li>
  <li><a href="#">RSS Feed All-in-one ;)</a></li>
 </ul>
 <h3>Infos</h3>
 <p><a href="#">Was ist ein Weblog?</a><br />
 <a href="#">Was ist RSS? / Was ist ein RSS Feed?</a><br />
 <a href="#">Registrieren</a> / <a href="#">Login</a><br />
 Gilt nur für die Webseite, nicht für's Forum!</p>
 <h3>Kategorien</h3>
 <ul class="liste">
  <li><a href="#">Planung</a></li>
  <li><a href="#">Bilder</a></li>
  <li><a href="#">Internes</a></li>
  <li><a href="#">Sonstiges</a></li>
 </ul>
 <h3>Die letzten Kommentare</h3>
 <ul id="lastcomments">
  <li>Keine Kommentare</li>
 </ul>
 <div id="footer">
  <p><a href="#">(X)HTML</a> | <a href="#">CSS</a> | <a href="#">Administration</a> | <a href="#">WordPress</a><br /><a href="#">Impressum</a> | <a href="#">Credits</a></p>
 </div>
</div>
</body>
</html>
__________________
trashhero.de
Mein kleiner Weblog
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 02.07.2006, 20:58
Benutzerbild von Yhi
Yhi Yhi ist offline
/* no comment */
XHTMLforum-Mitglied
 
Registriert seit: 28.05.2006
Beiträge: 208
Yhi befindet sich auf einem aufstrebenden Ast
Standard

Code:
ul#navigation a:hover {
	color: #000;
	background: #fff;
	}
Meinst du in diesem Teil?

Ich hab das grad ausprobiert... funktioniert bei mir ohne Probleme (mit Firefox).
__________________
PHP und Webdesign Blog
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 02.07.2006, 21:05
das müllheld
neuer user
Thread-Ersteller
 
Registriert seit: 15.12.2005
Ort: Saarbrücken
Beiträge: 52
trashhero befindet sich auf einem aufstrebenden Ast
Standard

Ups, ich depp. Total vergessen anzugeben welche Liste ich meine.
Also ich meine das:
Code:
ul.liste a:hover {
	background: #5DAE07 url(images/kateghover.jpg) repeat-x;
	color: #fff;
	}
Das funzt nicht.
__________________
trashhero.de
Mein kleiner Weblog
Mit Zitat antworten
  #4 (permalink)  
Alt 02.07.2006, 21:09
Benutzerbild von Yhi
Yhi Yhi ist offline
/* no comment */
XHTMLforum-Mitglied
 
Registriert seit: 28.05.2006
Beiträge: 208
Yhi befindet sich auf einem aufstrebenden Ast
Standard

Aso ok. Nimm

Code:
#sidebar a:hover {
	color: #5DAE07;
	}
raus. Oder so:

Code:
ul.liste a:hover {
	background: #5DAE07 url(images/kateghover.jpg) repeat-x;
	color: #fff !important;
	}
__________________
PHP und Webdesign Blog
Mit Zitat antworten
  #5 (permalink)  
Alt 02.07.2006, 21:10
Benutzerbild von heiko_rs
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 18.09.2005
Ort: Berlin
Beiträge: 9.863
heiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblick
Standard

Zitat:
Zitat von trashhero
Code:
ul#commentlist li:hover {
	background: #5DAE07 url(images/comment.jpg) no-repeat;
	}
Du weißt, daß das im IE nicht geht? Das solltest Du anders lösen.
Mit Zitat antworten
  #6 (permalink)  
Alt 02.07.2006, 21:14
Benutzerbild von heiko_rs
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 18.09.2005
Ort: Berlin
Beiträge: 9.863
heiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblick
Standard

Zitat:
Zitat von Yhi
Aso ok. Nimm

Code:
#sidebar a:hover {
	color: #5DAE07;
	}
raus. Oder so:

Code:
ul.liste a:hover {
	background: #5DAE07 url(images/kateghover.jpg) repeat-x;
	color: #fff !important;
	}
Oder Spezifität erhöhen: #sidebar ul.liste a:hover
Mit Zitat antworten
  #7 (permalink)  
Alt 02.07.2006, 21:45
das müllheld
neuer user
Thread-Ersteller
 
Registriert seit: 15.12.2005
Ort: Saarbrücken
Beiträge: 52
trashhero befindet sich auf einem aufstrebenden Ast
Standard

So, danke für die Hilfe. Das !important hat gereicht, damit es bei Opera, IE und FF funzt. Mehr Browser hab z.Z. nicht zum Testen da.

Wegen der "ul#commentlist li:hover": Das ist sowieso noch nicht fertig und das Bild als Hover sieht sowieso nicht sehr gut, von daher wird das wohl noch mal neu gemacht.

Danke für die schnelle Hilfe.
__________________
trashhero.de
Mein kleiner Weblog
Mit Zitat antworten
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Seite links ausrichten like.no.other CSS 10 26.01.2011 01:10
z-index hoch, dennoch grafik nicht ganz oben bergg CSS 6 27.10.2010 16:02
Ungewöhnlicher abstand beim clearen von floats adrianno CSS 14 16.09.2009 14:20
Hilfe bei Positionierung eines Menüs opa-rudi CSS 0 18.11.2008 11:21
#boxes a:hover.info: 2.posting mit css !!! marioN CSS 5 25.01.2004 17:04


Alle Zeitangaben in WEZ +2. Es ist jetzt 21:09 Uhr.