Button min-width / Buttons alle die gleiche Mindestbreite

marie90

Hallo,

ich habe im css meines "child" folgenden Button erstellt:

HTML

/**
* Button
*/
.wpb_button {
  border: 1px solid;
    border-color: #ccc #ccc #bbb;
    border-radius: 3px;
    background: #e6e6e6;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.5), inset 0 15px 17px rgba(255, 255, 255, 0.5), inset 0 -5px 12px rgba(0, 0, 0, 0.05);
    color: rgba(0, 0, 0, .8);
    cursor: pointer; 
    -webkit-appearance: button;
    font-size: 16px;
    font-size: 1.5rem;
    min-width: 200px;
    line-height: 1;
    padding: .6em 1em .4em;
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.8);
}

Alles anzeigen

Funktioniert auch soweit so gut - nur nicht die Sache mit der "min-width". Was auch immer ich da reinschreibe wird ignoriert.

Kurz zur Erklärung.

Mich stört z.B. in einem Anmeldeformular, dass der Button "Login" , entsprechend dem Wort natürlich, viel kürzer ist als z.B. "Neuanmeldung".

Hat jemand eine Idee, bzw. an welcher Stelle muss ich denn suchen, um diese "auto-width" zu umgehen.

Vielen Dank.

Werbepost

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

bgeissler

gib mal eine Link zur Seite.

helix

Was ist denn das zugrundeliegende Element?
Ein Button „Login“ weist darauf hin, dass es ein html-Element button oder ein input type="submit" sein könnte. Beides wären inline-Elemente und die haben von sich aus keine Breite, sondern sind eben so breit wie ihr Inhalt. Also gib deinem Button ein display: inline-block;

Gruß
helix

marie90

Vielen lieben Dank für die Rückmeldung.

@ bgeissler: Seite läuft aktuell leider nur auf localhost

helix: DAAAANKESCHÖN für den alles entscheidenten Hinweis. :p Ich bin begeistert!

Herzliche Grüße,
marie90

helix

Nur halb topic: marie90, was glaubst du, wieviele Leute hier im Forum sich – genauso wie du – in ähnlich gelagerten Fällen schon einen Wolf gesucht und probiert haben … Ich glaube, es sind zumindest nicht wenige. Ich gehöre definitiv dazu.
Das Problem am Anfang ist: weil man nicht weiß, woran es liegt, weiß man auch nicht, wonach man suchen muss; schlimmer: man kann es gar nicht wissen, weil man es dazu wissen müsste …
Also: bitte, gern geschehen.

Gruß
helix

Willkommen! Melden Sie sich an oder registrieren Sie sich.

Button min-width / Buttons alle die gleiche Mindestbreite

Jetzt mitmachen!