Ergebnis 1 bis 7 von 7

Thema: Inhald von Menü-div verschiebt sich (IE-FF)

  1. #1
    Interessierte/r
    Registriert seit
    11.03.2008
    Beiträge
    127
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard Inhald von Menü-div verschiebt sich (IE-FF)

    Ich habe folgendes Problem:
    Auf einer meiner Seiten werden die Buttons im Menü-div im IE völlig richtig angezeigt, wärend sie im FF um etwa 20px nach unten und nach rechts verschoben sind, sodass nicht alles drauf ist!

    Muss ich da noch irgend etwas eingeben?
    Mit margin-top:0px hats nicht geklappt!

    Falls ihr den Quelltext braucht, einfach kurz schreiben!

    Schonmal vielen Dank für eure Bemühungen!
    Achtung: Dies ist ein alter Thread im HTML und Webmaster Forum
    Diese Diskussion ist älter als 90 Tage. Die darin enthaltenen Informationen sind möglicherweise nicht mehr aktuell. Erstelle bitte zu deiner Frage ein neues Thema im Forum !!!!!
    Wer kämpft kann verlieren, wer nicht kämpft hat schon verloren!

  2. #2
    Prinz(essin) Avatar von Alienx
    Registriert seit
    04.05.2007
    Ort
    Stuttgart
    Alter
    24
    Beiträge
    904
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    Jo,

    der Quelltext wäre sinnvoll. Hast du vielleicht mit 'padding'-Werten gearbeitet?

    MfG Alienx


  3. #3
    Interessierte/r
    Themenstarter

    Registriert seit
    11.03.2008
    Beiträge
    127
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    Code:
    <html>
    
    <head>
    <title>stage-technics.de</title>
    
    <style type="text/css">
    
    div
    &#123;
    position&#58;absolute;solid black;border&#58;0px
    &#125;
    
    .haupt
    &#123; 
    position&#58;absolute; 
    border&#58;0px ;solid black;
    width&#58;1024px; height&#58;650;
    margin-top&#58;-300px;
    margin-left&#58;-512px; 
    left&#58;50%; top&#58;50%;
    background-color&#58;#ffffff;
    &#125;
    
    .div1
    &#123; 
    border&#58;0px ;solid black;
    left&#58;0px;top&#58;0px;
    width&#58;1024px; height&#58;1;
    background-color&#58;#ffffff;
    &#125;
    
    
    .menue
    &#123;
    border&#58;0px ;solid black;
    left&#58;500px;top&#58;0px;
    width&#58;500px;height&#58;30;
    background-image&#58;url&#40;dateien/design/menue23.png&#41;;
    
    &#125;
    
    .div4
    &#123;
    border&#58;0px ;solid black;
    left&#58;-200px;top&#58;0px;
    width&#58;200px;height&#58;30;
    background-image&#58;url&#40;dateien/design/div4.png&#41;;
    
    &#125;
    
    
    .start
    &#123;
    border&#58;0px ;solid black;
    left&#58;-50px;top&#58;30px;
    width&#58;750px;height&#58;600;
    background-color&#58;#ff4500;
    background-image&#58;url&#40;dateien/design/start.png&#41;;
    
    &#125;
    
    
    .bilder
    &#123;
    border&#58;0px ;solid black;
    left&#58;-250px;top&#58;0px;
    width&#58;250px;height&#58;600;
    background-color&#58;#ff4500;
    background-image&#58;url&#40;dateien/design/bilder.png&#41;;
    
    &#125;
    
    .div2
    &#123;
    border&#58;0px ;solid black;
    left&#58;0px;top&#58;-30px;
    width&#58;459px;height&#58;300;
    background-image&#58;url&#40;dateien/design/div2.png&#41;;
    
    &#125;
    
    .div3
    &#123;
    border&#58;0px ;solid black;
    left&#58;667px;top&#58;405px;
    width&#58;333px;height&#58;225;
    background-image&#58;url&#40;dateien/design/div3.png&#41;;
    
    &#125;
    
    .div5
    &#123;
    border&#58;0px ;solid black;
    left&#58;125px;top&#58;195px;
    width&#58;190px;height&#58;20px;
    background-color&#58;#000000;
    
    &#125;
    
    a.link1 &#123; 
    width&#58;92px; 
    height&#58;30px; 
    background-image&#58;url&#40;dateien/menue/aktuelles1.png&#41;; 
    &#125; 
    
    a.link1&#58;hover &#123; 
    background-image&#58;url&#40;dateien/menue/aktuelles2.png&#41;; 
    &#125;
    
    a.link2 &#123; 
    width&#58;93px; 
    height&#58;30px; 
    background-image&#58;url&#40;dateien/menue/ueberuns1.png&#41;; 
    &#125; 
    
    a.link2&#58;hover &#123; 
    background-image&#58;url&#40;dateien/menue/ueberuns2.png&#41;; 
    &#125;
    
    a.link3 &#123; 
    width&#58;117px; 
    height&#58;30px; 
    background-image&#58;url&#40;dateien/menue/referenzen1.png&#41;; 
    &#125; 
    
    a.link3&#58;hover &#123; 
    background-image&#58;url&#40;dateien/menue/referenzen2.png&#41;; 
    &#125;
    
    a.link4 &#123; 
    width&#58;88px; 
    height&#58;30px; 
    background-image&#58;url&#40;dateien/menue/material1.png&#41;; 
    &#125; 
    
    a.link4&#58;hover &#123; 
    background-image&#58;url&#40;dateien/menue/material2.png&#41;; 
    &#125;
    
    a.link5 &#123; 
    width&#58;79px; 
    height&#58;30px; 
    background-image&#58;url&#40;dateien/menue/galerie1.png&#41;; 
    &#125; 
    
    a.link5&#58;hover &#123; 
    background-image&#58;url&#40;dateien/menue/galerie2.png&#41;; 
    &#125;
    
    </style>
    </head>
    
    <body link="white" vlink="white" alink="white" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
    
    
    <div class="haupt">
    
    <div class="div1">
    
    <div class="menue" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
    [img]dateien/menue/001.png[/img][img]dateien/menue/002.png[/img][img]dateien/menue/003.png[/img][img]dateien/menue/004.png[/img][img]dateien/menue/005.png[/img] 
    
    
    
    <div class="div4">
    
    <div class="start">
    <font align="justify" color="white" size="3" face="Verdana">
    
    
    
    
    
    
    
    
    
    
    
    
    
    Stage-technics goes online. 
    
    
    Wir haben nun unsere Internetpräsenz erstellt und Online gestellt. 
    
    Wir wünschen Ihnen viel Spaß beim durchstöbern und vielleicht sehen wir uns einmal 
    
    auf der einen oder anderen Veranstaltung wieder.
    
    
    Ihr stage-technics Team
    </font>
    
    
    <div class="bilder">
    
    <center>
    
    
    
    
    
    
    
    
    
    
    
    
    
    <a href="dateien/aktuelles/003.png" target="neu">
    [img]dateien/aktuelles/001.png[/img]
    </a>
    
    
    
    <a href="dateien/aktuelles/004.png" target="neu">
    [img]dateien/aktuelles/002.png[/img]
    </a>
    </center>
    
    
    
    <div class="div2">
    <div class="div3">
    <div class="div5">
    
    <font color="white" size="2" face="Verdana">
    Contact | Impressum | Links
    </font>
    
    
    </div>
    </div>
    </div>
    </div>
    </div>
    </div>
    </div>
    </div>
    </div>
    
    </body>
    </html>
    Nee, mit padding werten hab ich nichts gemacht!
    Wer kämpft kann verlieren, wer nicht kämpft hat schon verloren!

  4. #4
    Prinz(essin) Avatar von Greg10
    Registriert seit
    12.05.2007
    Beiträge
    825
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    Der FF erzwingt bei listen immer links und oben einen freiraum, kann man nix gegen machen
    Musst mit absätzen und dem &bull; zeichen arbeiten
    Orthografie und Grammatik in diesem Beitrag sind frei erfunden und eine eventuell gefundene Übereinstimmung mit einer lebenden oder toten Sprache sollte von allen Beteiligten unverzüglich ignoriert werden.

    K-Progs (In bearbeitung)
    Der inoffizielle Forum-hilfe IRC-Channel
    (Server: irc.freenode.net ; Channel: #forum-hilfe) (Client für FF)
    Ich hab auch 'n Jabber-Account beim CCC

  5. #5
    Interessierte/r
    Themenstarter

    Registriert seit
    11.03.2008
    Beiträge
    127
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    Also anstatt die Buttons alle hintereinander reinzuschreiben soll ich sie untereinander machen?
    Wer kämpft kann verlieren, wer nicht kämpft hat schon verloren!

  6. #6
    Prinz(essin) Avatar von Greg10
    Registriert seit
    12.05.2007
    Beiträge
    825
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    upps, sry ich glaub ich bin da irgendwo verrutscht^^
    (hab gestern durchgemacht)

    mmh zum egentlichen problem hab ich keine lösung....
    werd nochmal drüber nachdenken
    Orthografie und Grammatik in diesem Beitrag sind frei erfunden und eine eventuell gefundene Übereinstimmung mit einer lebenden oder toten Sprache sollte von allen Beteiligten unverzüglich ignoriert werden.

    K-Progs (In bearbeitung)
    Der inoffizielle Forum-hilfe IRC-Channel
    (Server: irc.freenode.net ; Channel: #forum-hilfe) (Client für FF)
    Ich hab auch 'n Jabber-Account beim CCC

  7. #7
    Meister(in)
    Registriert seit
    10.01.2008
    Ort
    Passau/Ösiland
    Beiträge
    267
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    Hi,

    Zitat Zitat von Greg10
    Der FF erzwingt bei listen immer links und oben einen freiraum, kann man nix gegen machen
    Musst mit absätzen und dem &bull; zeichen arbeiten
    *räusper*, ähem..., ich seh da nirgendwo eine Liste.

    Der menü-div enthält eine Reihe von a's.

    a ist ein inline-Element, da kannste vertikale margins knicken.
    Die Höhe von Inline-Elementen kannste nur durch die Schriftgröße oder line-height verändern.

    Ich glaube auch nicht das das so mit deinem grafischen Menü funktionieren wird.

    Erstmal gehören die Links in eine Liste:

    Code:
    <ul id="navi">
       <li id="navi01">Link 1
         ......................usw.[/list]
    Für alle Zustände des Links (normal, hover, etc.) macht man eine Grafik die alle Zustände enthält.
    Die Buttons werden als Hintergrundgrafik eingebunden und je nach Zustand einfach mit Background-position verschoben, sodaß immer die gewünschte Grafik je nach Linkzustand eingeblendet wird.

    a braucht position:absolute dafür und bekommt die HG-Grafik zugewiesen.
    li braucht dann natürlich position:relative damit sich die absolut positionierte
    Grafik daran orientieren kann.

    Der Linktext sollte auch nicht in der Grafik stehen, weil dann die Sumas nicht weiterkommen (können nicht in Grafiken lesen!), Screenreader-user nicht weiterkommen und bei ausgeschalteten Grafiken auch nix mehr geht.

    Einzige Möglichkeit das zu umgehen wäre
    Image Replacement nach Gilder/Levin.

    Grafische Menüs sind nicht ganz so einfach zu realisieren.

    koslowski

Ähnliche Themen

  1. Tabelle verschiebt sich!
    Von eatofid im Forum HTML & CSS Forum
    Antworten: 6
    Letzter Beitrag: 14.03.2008, 14:33
  2. Design verschiebt sich
    Von massaw13 im Forum PHP Forum - Apache - CGI - Perl - JavaScript und Co.
    Antworten: 7
    Letzter Beitrag: 14.02.2007, 00:26
  3. text verschiebt sich
    Von im Forum HTML & CSS Forum
    Antworten: 4
    Letzter Beitrag: 14.10.2006, 15:11
  4. iframe verschiebt sich
    Von Max im Forum HTML & CSS Forum
    Antworten: 7
    Letzter Beitrag: 09.12.2005, 23:39
  5. IE - verschiebt sich alles
    Von Html-Neuling im Forum HTML & CSS Forum
    Antworten: 10
    Letzter Beitrag: 13.08.2005, 20:56

Stichworte

Berechtigungen

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