Contact Form 7 / Allgemeines CSS - Wie erstelle ich eine 1/3 Zeile?

  • Moin liebes Forum,

    ich verwende grade das Contact Form 7 welches so aussieht:
    http://wordpress.p154953.webspaceconfig.de/?page_id=92&lang=de

    Folgende Css dabei:

    Ich wurde nun gerne Zeilen wie die andere mit Herr/Frau auf eine 1 drittel größe haben und 2 drittel für den Nachnamen.
    Was genau muss ich da jetzt schreiben? Bzw. welche Fehler sollte man versuchen zu vermeiden?

    Liebe Grüße,
    hartu

    • Anzeige

    Hallo!

    Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

    • ✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
    • ✔️ Deutsche Server & DSGVO-konform
    • ✔️ Persönlicher Support (kein 0815-Ticket-System)

    Mehr erfahren

  • Danke sehr für die Antwort :-)

    Also mir gehts auch sehr primär um das verstehen, da ich noch nicht allzu bewandert bin was CSS angeht.

    Also mein Code sollte doch theoretisch jetzt so aussehen oder?

    Code
    .column-quarter{	float: left;
    	position: relative;
    	padding: 0.65rem;
    	width:100%;
            size:25;
    	-webkit-box-sizing: border-box;
            -moz-box-sizing: border-box;
            box-sizing: border-box
    }

    Dann hätte ich im Ergebnis Zeile 1: 25 % (Anrede) und 75 % (Nachname)

    Okay, dass klappt so noch nicht, habe ich etwas übersehen?

  • Ja. Die Angabe gehört nicht ins CSS sondern in den shortcode des Formulars

    Zitat

    [text* your-name size:30 maxlength:60]


    (Die Angaben sieht man, wenn man die empfohlene Doku bis zum Ende liest.) :-)

  • Ja. Die Angabe gehört nicht ins CSS sondern in den shortcode des Formulars
    (Die Angaben sieht man, wenn man die empfohlene Doku bis zum Ende liest.) :-)

    Danke dir, dass hat mir sehr weitergeholfen. :-)
    Ohman manchmal sieht man es einfach nicht..

    Eine andere Frage hätte ich da noch. Ich würde gerne den abschicken Button ohne Verlauf sondern mit einfacher Farbe füllen.
    Die entsprechende Klasse habe ich auch schon geändert:

    .sendbutton
    background: #65B32E;
    color: #fff;

    Meine Frage wäre jetzt, laut der Prüfen Funktion von Chrome sieht es so aus als ob auch nur diese Klasse auf den Button zugreift.
    Allerdings verändert sich nichts. Vermute das zwei Klassen auf ihn zeigen? :/

    Liebe Grüße
    hartu

  • also der Verlauf kommt von
    .wpcf7-form input[type="submit"], .wpcf7-submit

    der Background selber aus
    .wpcf7-submit


    selbes Spiel beim hovern
    .wpcf7-form input[type="submit"]:hover, .wpcf7-submit:hover

    und
    .wpcf7-submit:hover

    [size=10]Bitte immer zuerst die Forensuche nutzen und erst danach Deine Fragen hier im Forum stellen, denn sehr vieles wurde schon mehrfach beantwortet. Bitte dabei auch die Forenregeln beachten.
    Kein Support per PN - Fragen gehören ins Forum.[/SIZE]
    [size=8]Wenn du eine weise Antwort verlangst, musst du vernünftig fragen. (Johann Wolfgang von Goethe)[/SIZE]

  • Hallo Maxe,

    vielen dank für deine Antwort :-)

    Das Hilft mir schon einiges weiter. Aber so richtig geklappt hat es noch nicht..
    Also zum reinen Verständnis, die CSS überschreibt ja Befehle aus der Stylesheet richtig? Das heißt wenn ich keinen Verlauf haben möchte, müsste ich ja aus der CSS den Befehl rauslöschen und mit einen anderen sagen das er einfach Füllfarbe verwenden soll oder?
    Mir ist klar, dass man unter Themen Optionen Custom CSS einfügen kann welche beim Update ja bestehen bleibt, allerdings möchte ich ja eher das etwas weg ist und nicht wiederkommt.
    Oder denke ich grade einfach zu kompliziert :O

    Liebe Grüße,
    hartu

  • das Prinzip ist nicht Löschen, sondern Überschreiben ... so z.B.:

    Code
    .wpcf7-form input[type="submit"], .wpcf7-submit {
        background: white;
        color: black;
    }
    .wpcf7-form input[type="submit"]:hover, .wpcf7-submit:hover {
        background: white;
        color: black;
    }

    [size=10]Bitte immer zuerst die Forensuche nutzen und erst danach Deine Fragen hier im Forum stellen, denn sehr vieles wurde schon mehrfach beantwortet. Bitte dabei auch die Forenregeln beachten.
    Kein Support per PN - Fragen gehören ins Forum.[/SIZE]
    [size=8]Wenn du eine weise Antwort verlangst, musst du vernünftig fragen. (Johann Wolfgang von Goethe)[/SIZE]

  • Vielen vielen Lieben dank, jetzt hats Klick gemacht :-)!
    Danke sehr habe es endlich verstanden. Werde mir jetzt erstmal ein CSS Buch zulegen :p

    Liebe Grüße,
    hartu

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!