mediengestalter.info
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter

Aktuelles Datum und Uhrzeit: Fr 29.03.2024 10:09 Benutzername: Passwort: Auto-Login

Thema: Problem mit css navi vom 03.09.2008


Neues Thema eröffnen   Neue Antwort erstellen MGi Foren-Übersicht -> Allgemeines - Nonprint -> Problem mit css navi
Autor Nachricht
seestern78
Threadersteller

Dabei seit: 05.10.2007
Ort: Wien
Alter: -
Geschlecht: -
Verfasst Mi 03.09.2008 12:05
Titel

Problem mit css navi

Antworten mit Zitat Zum Seitenanfang

Hallo,

ich bin gerade dabei in ein bestehendes horizontales textbasiertes Menü bei dem Punkt Projekte ein Submenü einzufügen, dass sich nach unten aufklappen soll. Im Aufklappmenü sollen die 2 links horizontal nebeneinander stehen.

Das hat so jetzt auch funktioniert - aber wenn ich mit der Maus auf Projekte fahre und das Menü ausklappt, verschieben sich die links (Philosophie, Kontakt, links) nach rechts. Diese sollen sich aber nicht verändern.

Ich habe nun versucht der #nav li einen width:verschieden Wertepx; zu geben - aber dann stimmen die Abstände der hauptlinks nicht mehr.


Das ist der html code:

Code:
<div id="nav">      
   <ul>
      <li><a href="index.html">STARTSEITE</a></li>
      <li><a href="team.html">TEAM</a></li>
      <li><a  href="projekte.html">PROJEKTE</a>
      <ul>
      <li><a href="#">Fotografie</a></li>
     <li><a href="#">Grafik</a></li>
    
    </ul>
      </li>
      <li><a href="philosophie.html">PHILOSOPHIE</a></li>
      <li><a href="kontakt.html">KONTAKT</a></li>
      <li><a href="links.html">LINKS</a></li>
   </ul>
 </div>


das ist das stylesheet:
Code:
*{
margin: 0;
padding: 0;
}   

body { height: 100%; font: 95% Verdana, Arial, Helvetica, sans-serif; color: #363535; background-color: #fff; }

a { color: #363535; font-size: 8pt; text-decoration: none; }

a:hover { color: #666666; }


ul {
list-style-type: none; }

#nav {
position: absolute; top: 48px;margin-left: 52px; }

#nav li {display: inline;
 float: left;  }

#nav a {  display: block;
padding: 0px 7px; outline: none; }

#nav li ul { display:none; } /* Normalzustand eingeklappt */

#nav  li:hover ul  { display:block; } /* Ausgeklappt */
  View user's profile Private Nachricht senden
Fritz.Stefan

Dabei seit: 23.08.2008
Ort: -
Alter: -
Geschlecht: -
Verfasst Mi 03.09.2008 12:48
Titel

Antworten mit Zitat Zum Seitenanfang

Warum das Rad neu erfinden.

Viele fariationen von solchen Menüs findest du hier:

http://www.cssplay.co.uk/menus/
  View user's profile Private Nachricht senden
Anzeige
Anzeige
seestern78
Threadersteller

Dabei seit: 05.10.2007
Ort: Wien
Alter: -
Geschlecht: -
Verfasst Mi 03.09.2008 13:07
Titel

Antworten mit Zitat Zum Seitenanfang

Ich kenne diesen link- hab ihn schon gestern durchforstet - aber nichts Passendes gefunden, weil ich nur ein ganz simples menü haben möchte, ohne bilder ...
  View user's profile Private Nachricht senden
sahnemuh

Dabei seit: 19.06.2003
Ort: /dev/null
Alter: 42
Geschlecht: Männlich
Verfasst Mi 03.09.2008 13:54
Titel

Antworten mit Zitat Zum Seitenanfang

Code:
#nav  li:hover ul  { display:block; position: absolute; } /* Ausgeklappt */


und nicht vergessen: der ie6 kennt hover nur für links - darin wird der kram nicht laufen.
  View user's profile Private Nachricht senden
seestern78
Threadersteller

Dabei seit: 05.10.2007
Ort: Wien
Alter: -
Geschlecht: -
Verfasst Mi 03.09.2008 14:43
Titel

Antworten mit Zitat Zum Seitenanfang

Danke! Wie gestern funktioniert!

Könnte das im IE vielleicht mit diesem code klappen:
Code:
<!--[if lte IE 6]>
     <style type="text/css" media="screen">#nav { behavior:url("csshover.htc"); }</style>
   <![endif]-->


Werds mal versuchen, wenn das Parallels läuft..

Ansonsten muss ich mir eh was anderes einfallen lassen.
  View user's profile Private Nachricht senden
Benutzer 80255
Account gelöscht


Ort: -

Verfasst Mi 03.09.2008 14:48
Titel

Antworten mit Zitat Zum Seitenanfang

funktioniert fast Lächel

Code:
<!--[if lte IE 6]>
     <style type="text/css" media="screen">#nav { behavior:url("csshover.htc"); }</style>
   <![endif]-->


so funktioniert's:


Code:
<!--[if lte IE 6]>
     <style type="text/css" media="screen">body { behavior:url("csshover.htc"); }</style>
   <![endif]-->
 
seestern78
Threadersteller

Dabei seit: 05.10.2007
Ort: Wien
Alter: -
Geschlecht: -
Verfasst Mi 03.09.2008 14:54
Titel

Antworten mit Zitat Zum Seitenanfang

Danke für die Antwort!!!
  View user's profile Private Nachricht senden
 
Ähnliche Themen IE Problem mit CSS Navi
CSS Problem - Div Navi bis zum Footer
Problem mit Navi Leiste
PHP-Problem mit index.php und Navi
Sliding door navi // jQuery Problem
Problem beim Erstellen einer Navi
Neues Thema eröffnen   Neue Antwort erstellen
MGi Foren-Übersicht -> Allgemeines - Nonprint


Du kannst keine Beiträge in dieses Forum schreiben.
Du kannst auf Beiträge in diesem Forum nicht antworten.
Du kannst an Umfragen in diesem Forum nicht mitmachen.