#1 28. April 2010 Problem mit navi Hi, also ich bin grad dabei meine navileiste auszurichten, komme da aber auf so paar probleme und zwar erstmal zu den buttons => mit "a: hover" sollen die leuchten(also durch anderes bild ersetzt) wenn man mit der maus drüber fährt und dazu noch sollen die ganze buttons hintereinander in einer zeile stehen... da hab ich grad son problem mit.... am meisten hänge ich am hover... z.b. schon bei der eintellung hier unten zeigt der mir garkeinen button mehr an.. setze ich die postion auf absolute muss ich hover wegmachen und display auch entfernen.... das verwirrt mich grad echt ^^ ich hab das ganze auch ohne hover probiert das schaut dann so aus (position: absolute und display entfenrt) klick so soll es aber aussehen klick CSS CODE Code: #navibar { float: left; height: 52px; width: 950px; margin-top: 243px;} /* NAVIBAR */ a#news { background: url(images/news.jpg) no-repeat;height: 52px;width: 88px; display: block; } a#news:hover{background: url(images/news_on.jpg) no-repeat;} HTML-CODE Code: <html> <head> <title></title> <link href="main.css" rel="stylesheet" type="text/css" /> </head> <body> <div id="content"> <div id="navibar"> <a href="#" id="news"></a> <a href="#" id="about"></a> ... </div> <div id="ncontent"> </div> </div> </body> </html> + Multi-Zitat Zitieren
#2 28. April 2010 AW: Problem mit navi Jetzt auf die schnelle: Definier IMMER link, visited, hover, active. (In dieser Reihenfolge) {} reicht. + Multi-Zitat Zitieren
#3 28. April 2010 AW: Problem mit navi wie genau ? eig brauch ich ja nur den normalen link und hover mehr nicht deswegen + Multi-Zitat Zitieren
#4 29. April 2010 AW: Problem mit navi Dein CSS ist auch nicht wirklich strukturiert bzw. aufgeräumt. Schau dir das mal an (bezüglich Reihenfolge). :hover: Mouseover-Effekt: CSS-Referenz auf CSS 4 You - The Finest in Stylesheets + Multi-Zitat Zitieren
#5 4. Mai 2010 AW: Problem mit navi habs immer noch net so hingekriegt -.- sodass es in der reihe steht, der zeigt mir die buttons garnet mehr an + Multi-Zitat Zitieren
#6 11. Mai 2010 Zuletzt von einem Moderator bearbeitet: 14. April 2017 AW: Problem mit navi Code: #navibar { float: left; height: 52px; width: 950px; margin-top: 243px; } #navibar ul { height: 52px; width: 950px; } #navibar ul li { display:inline; float:left; list-style-type:none; } #navibar ul li a { text-indent: -9999px; display:block; height:52px; line-height:52px; } /* NAVIBAR */ #news { background: url(images/news.jpg) center top no-repeat;width: 88px; } #about { background: url(images/about.jpg) center top no-repeat;width: 88px; } #impressum { background: url(images/impressum.jpg) center top no-repeat;width: 88px; } #navibar a:hover{background-position: center bottom;} HTML: <div id="navibar"> <ul> <li><a href="#" title="News" id="news">News</a></li> <li><a href="#" title="About" id="about">About</a></li> <li><a href="#" title="Impressum" id="impressum">Impressum</a></li> </ul> </div> So sollten dann deine Grafiken aussehen, sie enthalten dann beide Zustände. Irgendwie sollte es so stimmen ^^ Bei fragen kannst ja schreiben - eventuell via PN. + Multi-Zitat Zitieren