searchform + Grafik ausrichten (twenty ten child)

  • Hallo zusammen,

    so, es ist so weit – mein erster Post…

    Ich versuche gerade ein childtheme vom twenty ten zu erstellen und hänge gerade am search-widget. Es wurde eine searchform.php erstellt, die Suche funktioniert auch.

    Das was ich einfach nicht gebacken bekomme ist, dass Eingabefeld mit der Grafik (Lupe) horizontal auf einer Linie auszurichten.
    Dies betrifft die Suche in der sidebar so wie die Suche im Hauptbereich bei einer nicht erfolgreichen Suche. Siehe hier: http://www.meefischli.com/?s=asdf&x=8&y=13

    Hoffe es kann mir jemand einen Tipp geben.

    Gruß
    Alex

    • 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

  • verursacht durch:

    Code
    .entry-content input (line 606)
    {
    margin-top: 0pt;
    margin-right: 0pt;
    margin-bottom: 24px;
    margin-left: 0pt;
    }


    welches wahrscheinlich fuer die kommentarfelder gebraucht wird.

    eine moegliche loesung:
    im child stylesheet einsetzen:

    Code
    #searchform input{margin-bottom:0;}
  • das ging fix, danke schon mal alchymyth!

    Code
    #searchform input{margin-bottom:0;}

    Das hat mir jetzt das searchform unter der »erfolglosen« Suche ausgerichtet,
    dies hat aber keine Auswirkung auf die widget-suche in der sidebar?

    Hast du eine Ahnung wie ich diese noch ansprechen kann (es ist ja eingentlich auch das searchform,oder?)

  • formattieren von search forms ist nicht einfach, aber es gibt einiges online - nach 'styling search forms with css' suchen.

    die sidebar form kann spezifisch angesprochen werden durch:

    Code
    .widget_search #searchform { ... } 
    .widget_search #searchform input { ... }
    .widget_search #searchform input#s { ... }
    usw.



    PS:
    firebug und das web developer add-on von firefox sind gute hilfsmittel, um css (und mehr) auszuchecken.

Jetzt mitmachen!

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