maggie: Navi und Suchfeld auf einer Linie

Hallo,
auf einem Hintergrundfeld (weißer Balken) soll eine Navigation (Navi1 - Navi4) erscheinen. Bei 'hover' soll ein Hintergundbild (rote senkrechte Linie) die volle Höhe des Hintergrundfeldes (und das Naviwort) ausfüllen.
Das Suchfeld soll rechtsbündig auf dem Hintergrundfeld stehen.

So sieht die HTML aus. Das Bild unten auf der Seite ist die Soll-Variante.

Könnt Ihr mir Tipps geben, welche Fehler im CSS stecken?

Danke.
Gruß
Maggie

  1. Könnt Ihr mir Tipps geben, welche Fehler im CSS stecken?

    Keine, es wird so dargestellt wie gewünscht - Block-Elemente erzeugenen einen Umbruch.

    .moduletable-haupt und .moduletable-suche möchten auch Inline-Elemente dargestellt werden, dann sind sie auch nenbeneinander.

    Du solltest dich aber ggf. von deiner div-Suppe trennen und das Markup überdenken.

    Dein Suchfeld möchte z.B ein form-Element sein. Warum deine Suche immerhalb eines div-Elements mit der id "menue_navigation" ist, versteht sie auch nicht ganz.

    Ebenso ist dein Sprachmix sehr verwirrend.

    module, table, menu
    und unmittelbar danach gibts dann
    menue, kopfteil usw

    Warum hast du eine div-Element mit der id "adress" (Englisch: address oder Deutsch: adresse) - wo doch ein address-Element recht gut geeignet wäre?

    Deine Fußzeile wunder sich übrigens auch, warum sie im Kopfteil ist.

    1. »» Könnt Ihr mir Tipps geben, welche Fehler im CSS stecken?
      Keine, es wird so dargestellt wie gewünscht

      Entschuldige bitte, ich meine natürlich, dass meine Style-Sheet Angaben Fehler aufweisen, denn die Darstellung ist nicht so wie gewünscht. Das untere Bild zeigt die gewünschte Darstellung.

      »» - Block-Elemente erzeugenen einen Umbruch.

      Das 'div class="moduletable-haupt' habe ich mit span class="moduletable-haupt' angesprochen - ich dachte dadurch den Umbruch zu umgehen, da 'span' ja ein inline-Element ist. Ist das falsch?

      .moduletable-haupt und .moduletable-suche möchten auch Inline-Elemente dargestellt werden, dann sind sie auch nenbeneinander.

      Du solltest dich aber ggf. von deiner div-Suppe trennen und das Markup überdenken.

      Ja! Kannst Du mir ein hilfreiches Tutorial empfehlen, damit ich die CSS richtig anwende.

      Dein Suchfeld möchte z.B ein form-Element sein. Warum deine Suche immerhalb eines div-Elements mit der id "menue_navigation" ist, versteht sie auch nicht ganz.

      Die 'inputbox-suche' ist mit width: 190px definiert.
      Wechen Fehler habe ich hier gemacht, dass die Hintergrundfarbe nicht über die 190px angezeigt wird?

      Warum hast du eine div-Element mit der id "adress" (Englisch: address oder Deutsch: adresse) - wo doch ein address-Element recht gut geeignet wäre?

      Dem Adressblock wollte ich die Anweisung 'float: right;' geben, damit er rechts steht. Wie kann ich das mit dem address-Element erreichen?

      Danke für Hilfe.
      Gruß
      Maggie

      1. Hallo!
        Darf ich um Eure Hilfe bitten - ich komme bei der Formatierung nicht weiter.
        Besten Dank.
        Maggie

      2. Hi,

        Du solltest dich aber ggf. von deiner div-Suppe trennen und das Markup überdenken.

        Ja! Kannst Du mir ein hilfreiches Tutorial empfehlen, damit ich die CSS richtig anwende.

        Es war vom HTML-Code die Rede, nicht vom erst viel später kommenden CSS.

        Dem Adressblock wollte ich die Anweisung 'float: right;' geben, damit er rechts steht. Wie kann ich das mit dem address-Element erreichen?

        Genauso.
        CSS ist es furchtbar egal, wie ein Element heisst.

        MfG ChrisB

        --
        Light travels faster than sound - that's why most people appear bright until you hear them speak.