Ebenenproblem CSS

  • Hallo anscheinend wird mein anderer Beitrag nicht mehr gelesen da ich wesentlich vom Titel abgeschweift bin. Wenn euch nicht passt das ich ein neues Thema angefangen habe dann löscht doch den alten Beitrag.

    also nun zu meinem Problem:
    Ich habe auf der Seite http://www.2007.ferronato.ch ein Menü das wunderbar funktioniert, und habe mich entschieden, alle seiten einzeln zu erstellen. jetzt habe ich ein kleines Problem. Wenn ich den Inhalt mit einem div-raster mache, dann ist das Menü immer hinter diesem Raster und es funktioniert nicht mehr. das Fänomen tritt hauptsächlich bei den beiden Formularen auf, welche Ihr unter dem Link Bestellformular betrachten könnt.

    Wie kann ich dies umgehen?

    kann mir da jemand helfen?

  • Da wiederholen sich sehr viele Angaben, wie z.B. Schriftart, die man nur einmal in den body schreiben müsste.
    Dann arbeitest du sehr viel mit position absolute und relative und z-indexen. Das ist idR nicht erforderlich.
    Für das Bestellformular wäre vermutlich eine Tabelle die idealere Lösung, anstatt jedes Feld mit absoluten Angaben zu positionieren.
    Bei der Navi hast du spezifische IE-Angaben hinterlegt, damit sie auch im IE funktionieren. Vermutlich hast du dich dabei am Beispiel des barrierefreien Menues orientiert. Es geht aber auch einfacher und damit übersichtlicher: http://www.drweb.de/leseproben/klappmenu.shtml. Auch hier sind normalerweise spezielle Positionierung nicht erforderlich, zumal du ein horizontales Menue hast.
    Stat "border" schreibst du

    Code
    order-bottom-style: solid; order-right-style: solid;

    Die Angabe wird damit wirkungslos. Wenn du sie nicht vermisst hast, dann kannst du sie auch rausschmeißen.
    Das sind nur mal einige Beispiele, die mir auf die Schnelle aufgefallen sind.
    Da kannst du sicherlich noch enorm abspecken. Sowohl im CSS- als auch im HTML-Teil.

  • bambid,

    ich würde Dir raten setze Dein Formular neu an, da es zu unübersichtlich ist.
    Alles im content löschen und folgendermaße neu ansetzen.

    Code
    <div  style="font-weight: bold; color:#333333;">
    <label for="first_name">
    First Name:
    </label>
      <input name="first_name" id="first_name" class="inputText" size="10" maxlength="100" value="" type="text">
    </div>

    Den style dann durch class="feld" ersetzen, einmalig definieren und mit float: left; und einem feste Abstand zum linken Rand definieren.
    Das einleitende <form ..... natürlich nicht vergessen.

    P.S.: Dann läuft auch alles mit Deiner Navi. ä,ö,ü siehe slfhtml
    Zeichen Ersetzung
    ä &auml;
    Ä &Auml;
    ö &ouml;
    Ö &Ouml;
    ü &uuml;
    Ü &Uuml;
    ß &szlig;

    Referenz: http://jeffhowden.com/code/css/forms/