+ Antworten
Ergebnis 1 bis 3 von 3

Thema: Mein Template CSS Problem mit IE, Menüdarstellung ist falsch, Padding will nicht

  1. #1
    Neu an Board
    Registriert seit
    16.10.2006
    Beiträge
    2
    Bedankte sich
    0
    Erhielt 0 Danksagungen
    in 0 Beiträgen

    Unglücklich Mein Template CSS Problem mit IE, Menüdarstellung ist falsch, Padding will nicht

    guckt euch mal bitte folgende Seite an: http://dev2.msp-bikes.de/

    In Firefox sieht die super aus, im IE geht das gar nicht. Ich habe Darstellungsprobleme mit den Schatten an der linken und an der rechten Seite und wenn ich oben auf "Der Laden" klicke wird im IE unter dem Headerpic so ein dunkelgrauer balken lang gezogen und ich kann mir nicht erklären woher das kommt. Noch schlimmer ist ja das im menü an der seite statt den pfeilen ein weißer balken angezeigt wird..woher kommt das.Auch das Padding von 20px im Contentbereich geht im IE nicht, was kann ich tun?



    hier die CSS:

    h1 { color: red; background-color: #d8da3d; }
    h2 { color: blue; background-color: #d8da3d; }
    h3 { color: purple; background-color: #d8da3d; }

    .homepage {
    width:900px;
    z-index:1;
    background-color: #FFFFFF;
    visibility: visible;
    height: 500px;
    position: absolute;
    }
    .contentpaneopen {
    width:586px;
    background-color: #fff;
    visibility: visible;
    top: 0px;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 12px;
    color: #000000;
    padding: 20px;
    border-top-width: 1px;
    border-right-width: 1px;
    border-bottom-width: 1px;
    border-left-width: 1px;
    border-top-style: none;
    border-right-style: none;
    border-bottom-style: none;
    border-left-style: none;
    border-top-color: #d9d9d9;
    border-right-color: #FFFFFF;
    border-bottom-color: #FFFFFF;
    border-left-color: #FFFFFF;
    }
    #menu {
    width: 234px;
    }

    body {
    margin: 0px;
    height: 100%;
    padding: 0px;
    font-family: Verdana, Helvetica, Sans Serif;
    font-size: 12px;
    color: #000000;
    background: #8E0000;
    text-align: center;
    }

    p {
    font-family: Verdana, Helvetica, Sans Serif;
    color: #000000;
    text-decoration: none;
    font-size: 12px;
    }


    a:link {
    font-family:Verdana, Arial, Helvetica, sans-serif;
    font-size:10px;
    color:#759d31;
    text-decoration:none;
    text-transform:uppercase;
    }

    a:hover {
    font-family:Verdana, Arial, Helvetica, sans-serif;
    font-size:10px;
    color:#637c96;
    text-decoration:none;
    text-transform:uppercase;
    }

    a:visited {
    font-family:Verdana, Arial, Helvetica, sans-serif;
    font-size:11px;
    color:#637c96;
    text-decoration:none;
    text-transform:uppercase;
    }

    .contentheading {
    font-size: 16px;
    font-weight: bold;
    color: #8E0000;
    text-transform: uppercase;
    }

    #alles {
    margin: 0 auto;
    }

    .icons {
    width: 900px;
    background-color: #8e0000;
    background-image: url(../images/msp_redtop_icons.gif);
    background-repeat: no-repeat;
    height: 20px;
    }
    .top {
    width: 900px;
    background-color: #FFFFFF;
    background-image: url(../images/msp_whitetop_logo.png);
    background-repeat: no-repeat;
    height: 54px;
    white-space: normal;
    }
    .headerpic {
    height: 201px;
    width: 860px;
    }
    .balken {
    height: 17px;
    width: 626px;
    background-color: #000000;
    background-image: url(../images/msp_balken.png);
    background-repeat: repeat-x;
    vertical-align:top;
    }
    .shadowcont {
    height: 20px;
    width: 626px;
    background-color: #fff;
    background-image: url(../images/msp_shadowcont.png);
    background-repeat: repeat-x;
    vertical-align:top;
    }
    .footerimage {
    height: 75px;
    width: 900px;
    background-color: #000000;
    background-image: url(../images/msp_whitefoot_hersteller.gif);
    background-repeat: no-repeat;
    }
    .shadow_left {
    width: 20px;
    background-color: #8e0000;
    background-image: url(../images/msp_shadowleft.gif);
    background-repeat: repeat-y;
    height:100%;
    }
    .shadow_right {
    width: 20px;
    background-color: #8e0000;
    background-image: url(../images/msp_shadowright.gif);
    background-repeat: repeat-y;
    height:100%;
    }


    ul#mainlevel-nav {
    list-style: none;
    padding-left: 40px;
    margin: 0px;
    }

    ul#mainlevel-nav li{
    padding: 0px;
    float: left;
    margin: 0px;
    width: auto !important;
    width: 10%;
    white-space: nowrap;
    }


    ul#mainlevel-nav li a {
    display: block;
    color: #8E8E8F;
    font-size: 13px;
    font-family: Verdana, Arial, sans-serif;
    font-weight: bold;
    text-decoration: none;
    text-transform: uppercase;
    text-align: center;
    line-height: 40px;
    height: 40px;
    width: 107px;
    padding-bottom: 14px;
    background: url(../images/msp_topmenu_bg.gif) no-repeat;
    }

    ul#mainlevel-nav li a:hover, ul#mainlevel-nav li a#active_menu-nav {
    color:#8E0000;
    background: url(../images/msp_topmenu_bg.gif) no-repeat;
    background-position: 0px -54px;
    }

    a.mainlevel-right:link, a.mainlevel-right:visited {
    display: block;
    color: #FFFFFF;
    font-size: 11px;
    font-family: Verdana, Arial, sans-serif;
    font-weight: bold;
    text-decoration: none;
    text-transform: uppercase;
    text-align: right;
    vertical-align: center;
    line-height: 19px;
    height: 19px;
    width: 210px;
    padding-right: 24px;
    background: url(../images/msp_mainmenu_bg.gif) no-repeat;
    }

    a.mainlevel-right:hover, a.mainlevel-right#active_menu {
    color:#8E0000;
    background: url(../images/msp_mainmenu_bg.gif) no-repeat;
    background-position: 0px -19px;
    }

    table.moduletableright th {
    height: 17px;
    width: 234px;
    background-color: #000000;
    background-image: url(../images/msp_balken.png);
    background-repeat: repeat-x;
    text-align: left;
    text-transform: uppercase;
    color: #FFFFFF;
    font-size: 10px;
    font-family: Verdana, Arial, sans-serif;
    font-weight: bold;
    line-height: 17px;
    text-indent: 0.5em;
    }
    hier ein screenshot mit den ID Infos von Web developer:



    kann mir jemand bei diesem Problem helfen? das wäre echt nett.

  2. #2
    Neu an Board
    Registriert seit
    16.10.2006
    Beiträge
    2
    Bedankte sich
    0
    Erhielt 0 Danksagungen
    in 0 Beiträgen

    Ausrufezeichen Beitrag schließen bitte

    Habe mein Anliegen, dass ich Hilfe brauche scheinbar falsch formuliert. Bitte schließen sie diesen Beitrag, da mir hierbei keiner helfen kann.

    Frohes neues Jahr und guten Rutsch

  3. #3
    Neu an Board Avatar von UBK3
    Registriert seit
    23.01.2006
    Beiträge
    67
    Bedankte sich
    2
    Erhielt 13 Danksagungen
    in 10 Beiträgen

    Standard

    Warum sollte dir keiner helfen können? Hast du den Fehler beseitigen können?

    Ich hab mir deine Page mal angeschaut und keine(*) Unterschiede von IE6 und FF2.0.0.1 festgestellt. Ich verwende auch WebDev bei FF (geniale Sache).

    Deine CSS sieht sauber aus, jedoch empfehle ich dir folgenden Eintrag zu beginn jeder CSS die Du beginnst:

    HTML-Code:
    * {margin:0; padding:0;} /* Resets all 2 Zero */
    Das wäre schonmal eine kleine Hürde und alle abstände wären bei mindestens 0. IE fügt manchmal gerne Abstände ein wo keine definiert worden sind.

    Wichtig auch zu wissen: IE hält sich nur an wenige Webstandarts ala W3C und CSS2.x; IE Interpretiert Margin anders als FF oder Konqueror ^^

    Noch wichtig zu deiner HP was ich gerad bemerkt habe:
    Du verwendest Frames in einem CMS. Versuche dies zu vermeiden, außerdem verwendest du keinen DocType. Sprich der Browser weiß nicht welchen HTML Code (Version) du verwendest. Darum geht der Browser automatisch in den Quirksmodus. Und da Interpretiert FF nochmals ganz anders als der IE. Verwende also nach möglichkeit:

    HTML-Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    Damit würde der jewailige Browser in den richtigen Modus gehen und die Renderengine würde auch alles richtig (LoL,.. IE macht eh was er will ) angezeigt werden.

    Tom
    Das einzige Backup das Du je brauchst ist das, wofür Du keine Zeit hattest.

    Homepage | Bugtracker | Module | Templates | Der Support war geil? Du bist befriedigt? Einfach mal Danke sagen... ^^

  4. Erhielt Danksagungen von:


+ Antworten

Ähnliche Themen

  1. Problem mit CSS - Hintergrund beim Drucken zu dunkel
    Von freak78 im Forum Joomla Templates
    Antworten: 9
    Letzter Beitrag: 25.02.2008, 14:44
  2. rhuk_solarflare_ii / Ohne "Bullet" (Aufzählungszeichen)
    Von ninja im Forum Joomla Templates
    Antworten: 8
    Letzter Beitrag: 18.11.2006, 17:07
  3. Content nach rechts verschieben
    Von flar2 im Forum Joomla Templates
    Antworten: 3
    Letzter Beitrag: 07.06.2006, 16:16
  4. SolarFlare II - Firefox / IE
    Von pc-dok im Forum Mambo Installation
    Antworten: 4
    Letzter Beitrag: 16.08.2005, 19:55
  5. Großen Problem mit Template und css...
    Von roxxinger im Forum Mambo Templates
    Antworten: 19
    Letzter Beitrag: 15.04.2005, 16:21

Lesezeichen

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein