button padding / width Problem

8

Ich verwende <button> , um eine Anfrage in einem Formular zu stellen. Ich habe auch eine a.button genau wie die <button> formatiert (ich brauche die a.button , um ein paar JS-Sachen zu machen).

Der Knopf hat eine gewisse Polsterung, eine feste Höhe. Wenn ich die Breite der Schaltfläche / a angeben, sehen beide gleich aus. Aber wenn ich dem <button> Breite hinzufüge, ignoriert es das Padding.

Ich habe dieses Problem in Chrome, Firefox und Opera, also denke ich, es ist kein Renderfehler. Auch das gleiche Problem mit <input type="submit" />

Hier ist das grundlegende CSS:

%Vor%

Das HTML:

%Vor%

Geige: Ссылка

Irgendwelche Vorschläge, warum die Browser die Auffüllung ignorieren? (Oben und Unten bei Verwendung von Höhe / Links und Rechts bei Verwendung von Breite).

    
js-coder 22.07.2011, 13:13
quelle

2 Antworten

20

Sehr seltsam, ich habe gesehen, dass Chrome eine box-sizing: border-box; -Regel für Eingabeelemente hat, also ist das Padding in der Breite enthalten ...

Um dies zu vermeiden, geben Sie einfach box-sizing: content-box; an (ein Präfix kann notwendig sein).

    
MatTheCat 22.07.2011, 13:22
quelle
0

Es sieht für mich gut aus, also könnte es sich um ein Konflikt im Stylesheet-Konflikt handeln. Verwenden Sie! Wichtig, um zu überschreiben, was auch immer es sein könnte und das könnte Ihr Problem lösen.

%Vor%

Hoffe, das hilft.

Michael.

    
Michael Giovanni Pumo 22.07.2011 13:18
quelle

Tags und Links