1. Dashboard
  2. Artikel
  3. Mitglieder
    1. Letzte Aktivitäten
    2. Benutzer online
    3. Team
    4. Mitgliedersuche
  4. Forum
    1. Unerledigte Themen
  • Anmelden
  • Registrieren
  • Suche
Dieses Thema
  1. HTML - Webmaster Forum
  2. HTML / Webmaster Forum
  3. HTML & CSS Forum

CSS-Menü Problem

  • PixxelDesign
  • 5. Juli 2009 um 18:57
  • PixxelDesign
    Teeny
    Beiträge
    23
    • 5. Juli 2009 um 18:57
    • #1

    Hallo liebe Community,

    ich habe ein kleines bis großes Problem mit einem CSS-Menü:

    http://bisher.creatissima.de/navigation/menu.php

    Das Menü wird im IE komplett richtig angezeigt. Der FF stellt es aber ganz und gar falsch dar. Das soetwas mal anders herum passiert kenne ich nur zu gut aus Erfahrung. Aber so rum??????

    Hier der HTML-Code:

    HTML
    <link rel="stylesheet" type="text/css" href="/admin_css/template_css.css" /><div>
    <div  id="mainmenu">
    <div class="menukopf_home"><a href="/index.php" name="menu1">HOME</a></div>
    <div class="menukopf"><a href="/ueber_uns/ueber_uns.php" name="menu2">ÜBER UNS</a></div>
    
    
    <ul>
    <li><a href="/ueber_uns/team.php" name="submenu1">Team</a> </li>
    <li><a href="/index.php" name="submenu3">Aktuelles</a> </li>
    <li><a href="/index.php" name="submenu4">Newsletter</a> </li>
    <li><a href="/index.php" name="submenu5">Anreise</a> </li>
    <li><a href="/index.php" name="submenu2">Empfehlungen</a> </li>
    </ul>
    
    
    <div class="menukopf"><a href="/leistungen/leistungen.php" name="menu3">LEISTUNGEN</a></div>
    
    
    <ul>
    <li><a href="/leistungen/strategieberatung.php" name="submenu11">Strategieberatung</a> </li>
    <li><a href="/leistungen/public_relations.php" name="submenu6">Public Relations</a> </li>
    <li><a href="/leistungen/corporate_publishing.php" name="submenu7">Corporate Publishing</a> </li>
    <li><a href="/index.php" name="submenu8">Werbung</a> </li>
    <li><a href="/index.php" name="submenu9">Online</a> </li>
    <li><a href="/index.php" name="submenu10">Werbemittel</a> </li>
    </ul>
    
    
    <div class="menukopf"><a href="/index.php" name="menu4">REFERENZEN</a></div>
    
    
    <ul>
    <li><a href="/index.php" name="submenu12">Kunden</a> </li>
    <li><a href="/index.php" name="submenu13">Projektbeispiele</a> </li>
    <li><a href="/index.php" name="submenu14">Testimonials</a> </li>
    </ul>
    
    
    <div class="menukopf"><a href="/index.php" name="menu5">PRESSE CENTER</a></div>
    <!--
    <ul>
    <li> </li>
    <li> </li>
    <li> </li>
    <li> </li>
    <li> </li>
    </ul>
    -->
    
    
    <div class="menukopf"><a href="/index.php" name="menu6">KONTAKT</a></div>
    <div class="menukopf_letzter"></div>
    
    
    <div id="kundenlogin">
    <a href="/index.php" name="kundenlogin"><img src="/images/link_bg_kundenlogin.jpg" alt="" name="kundenlogin_img" width="151" height="25" /></a></div>
    
    
    </div>
    </div>
    Alles anzeigen

    Und hier der Inhalt der CSS-Datei:

    Code
    #body, html        {width: 1060px;}
    
    
    img {border: 0;}
    
    
    #left         {width: 200px; background-image: url('../admin_images/left_bg.jpg'); background-repeat: no-repeat; background-color: #FFFFFF; float:left;}
    
    
    #content    {width: 825px; background-image: url('../admin_images/content_bg.jpg'); background-repeat: no-repeat; background-color: #FFFFFF; float:left;}
    
    
    #mainmenu {padding-left: 50px; padding-top: 100px;}
    
    
    .menukopf {letter-spacing: 1px; padding-bottom: 0px;}
    
    
    .menukopf a {text-decoration: none; background-image: url('../images/link_bg_normal.jpg'); background-repeat: no-repeat; padding: 5px; color: #000000; font-family: Arial, Verdana, sans-serif; font-size: 10pt; width: 100%; background-position: 2px 0px;}
    
    
    .menukopf a:hover, .menukopf a:active {text-decoration: none; background-image: url('../images/link_bg_aktiv.jpg'); background-repeat: no-repeat; padding: 5px; color: #FFFFFF; font-family: Arial, Verdana, sans-serif; font-size: 10pt; width: 100%;}
    
    
    .menukopf_home a {letter-spacing: 1px; text-decoration: none; background-image: url('../images/link_bg_home.jpg'); background-repeat: no-repeat; padding: 5px; color: #000000; font-family: Arial, Verdana, sans-serif; font-size: 10pt; width: 100%; background-position: 2px 0px;}
    
    
    .menukopf_home a:hover, .menukopf_home a:active {letter-spacing: 1px; text-decoration: none; background-image: url('../images/link_bg_aktiv.jpg'); background-repeat: no-repeat; padding: 5px; color: #FFFFFF; font-family: Arial, Verdana, sans-serif; font-size: 10pt; width: 100%;}
    
    
    
    
    #mainmenu ul {display: block; list-style-type: none; width: 100%; margin-left: 0px; padding-left: 1px; padding-top:0px;}
    
    
    #mainmenu ul li {width: 100%; margin-bottom: 0px;}
    
    
    #mainmenu ul li a, #mainmenu ul li a:hover, #mainmenu ul li a:active  {text-decoration: none; background-image: url('../images/link_bg_sub.jpg'); background-repeat: no-repeat; padding: 3px; color: #000000; font-family: Arial, Verdana, sans-serif; font-size: 10pt; width: 100%;}
    
    
    #mainmenu_letzter ul {border-bottom: 1px solid #000000; display: block; list-style-type: none; width: 100%; margin-left: 0px; padding-left: 1px; padding-top:0px;}
    
    
    #mainmenu_letzter ul li {width: 100%; margin-bottom: 0px;}
    
    
    #mainmenu_letzter ul li a, #mainmenu_letzter ul li a:hover, #mainmenu_letzter ul li a:active  {text-decoration: none; background-image: url('../images/link_bg_sub.jpg'); background-repeat: no-repeat; padding: 3px; color: #000000; font-family: Arial, Verdana, sans-serif; font-size: 10pt; width: 100%;}
    
    
    
    
    #kundenlogin {padding-top: 20px; margin-left: 0px;}
    
    
    #beitrag {padding-left: 50px; padding-top: 400px;}
    
    
    #beitrag_team {padding-left: 50px; padding-top: 400px;}
    
    
    #bilder_team {padding-top: 35px;}
    
    
    #bilder_team a {padding: 2px; border: 0;}
    
    
    #ueberschrift {color: D12741; font-family: Arial, Verdana, sans-serif; font-size: 14pt; font-weight: bold; width: 400px;}
    
    
    #inhalt {color: #000000; font-family: Arial, Verdana, sans-serif; font-size: 10pt; width: 480px; padding-top: 20px;}
    
    
    #newsbox {margin-top: 310px; margin-left: 40px; background-image: url('../images/bg_newsbox.jpg'); background-repeat: no-repeat; width: 150px; height: 317px;}
    
    
    #footer {clear:both; margin-left: 50px; padding-top: 50px; font-family: Arial, Verdana, sans-serif; font-size: 10pt;}
    
    
    #footer a {font-family: Arial, Verdana, sans-serif; font-size: 10pt; color: #000000;}
    
    
    #footer_copy {}
    
    
    #beschreibung {padding-top: 30px;}
    
    
    #team_name {font-family: Arial, Helvetica, sans-serif; font-size: 11pt; font-weight: bold; padding-bottom: 10px; width:400px;}
    
    
    #team_img {float:left;}
    
    
    #team_besch {float:left; padding-left: 10px; font-family: Arial, Helvetica, sans-serif; font-size: 10pt; width: 300px;}
    
    
    #team_tel_mail {clear:both; padding-top: 10px; font-family: Arial, Helvetica, sans-serif; font-size: 10pt;}
    Alles anzeigen

    was mache ich falsch? Sicher ist es etwas ganz simples, aber wenn man den Code dauernd sieht, dann gewöhnt man sich leider an den Anblick! Vll. könnt ihr mir ja auf die Sprünge helfen!

    Bin für jede Idee dankbar!

    Beste Grüße!

    Bernhard

    2 Mal editiert, zuletzt von PixxelDesign (5. Juli 2009 um 19:40)

  • sejuma
    Kaiser(in)
    Reaktionen
    5
    Beiträge
    2.720
    • 5. Juli 2009 um 19:03
    • #2

    Setze deinen Code mal zunächst auf eine komplette Seite inclusive Doctype, html, head und body.

    Edit:
    gib #mainmenu ul li a... noch ein "display: block;"

    [Blockierte Grafik: http://www.ohne-css.gehts-gar.net/img/banner/banner350x20.png]
    sejuma's CSS-Einsteigerkurs

  • PixxelDesign
    Teeny
    Beiträge
    23
    • 5. Juli 2009 um 19:09
    • #3

    ist: http://bisher.creatissima.de/index.php

  • PixxelDesign
    Teeny
    Beiträge
    23
    • 5. Juli 2009 um 19:16
    • #4
    Zitat von sejuma


    Edit:
    gib #mainmenu ul li a... noch ein "display: block;"

    Das hat das Problem gelöst!!! Du bist genial! Ich glaub ab jetzt bin ich hier öffter im Board! Ich werde keine Namen nennen, aber das, in dem ich mich drzeit rumtreibe entäuscht mich!

    Könnte ich vll. noch einen Tipp haben, weswegen der Abstand zwischen Menü und Submenü so groß bzw. überhaupt da ist????

    Danke!

  • sejuma
    Kaiser(in)
    Reaktionen
    5
    Beiträge
    2.720
    • 5. Juli 2009 um 19:30
    • #5

    Damit sollte er verschwinden:

    Code
    ul {margin: 0;}

    [Blockierte Grafik: http://www.ohne-css.gehts-gar.net/img/banner/banner350x20.png]
    sejuma's CSS-Einsteigerkurs

  • PixxelDesign
    Teeny
    Beiträge
    23
    • 5. Juli 2009 um 19:39
    • #6

    Das ist mal geil!!!!!! Bzw. DU bist geil!!!!! Scheiße warum bin ich da nicht drauf gekommen!

    ABER: Daaaaaaaaaaaaaaaaaannnnnnnnkkkkkkkkeeeeeeeeeeee!!!!!!


    Besten Dank!

    Bernhard


    P.S. Ich werde hier jetzt öfter sein. Gern auch als Helfer, wenn ich kann!

  • Unregistriert
    Gast
    • 6. Juli 2009 um 01:16
    • #7
    Zitat von PixxelDesign

    Das ist mal geil!!!!!! Bzw. DU bist geil!!!!! Scheiße warum bin ich da nicht drauf gekommen!

    ABER: Daaaaaaaaaaaaaaaaaannnnnnnnkkkkkkkkeeeeeeeeeeee!!!!!!


    Besten Dank!

    Bernhard


    P.S. Ich werde hier jetzt öfter sein. Gern auch als Helfer, wenn ich kann!

    Alles anzeigen


    Das würde uns auch jeden Fall freuen, und lern mal noch etwas Css

Tags

  • bilder
  • html
  • link
  • background
  • body
  • werbung
  • problem
  • code
  • php
  • div
  • position
  • doc
  • css
  • display
  • head
  • login
  • float
  • margin
  • doctype
  • content
  • quote

Benutzer online in diesem Thema

  • 1 Besucher
  1. Datenschutzerklärung
  2. Impressum
Community-Software: WoltLab Suite™
  • Alles
  • Dieses Thema
  • Dieses Forum
  • Artikel
  • Seiten
  • Forum
  • Erweiterte Suche
Zitat speichern