Wie kann ich einen Flüssigkeitsknopf machen?

Question

Ich habe eine Übermittlungsschaltfläche, die ich in einem Formular verwende. Der lange Text ist normalerweise in Ordnung, verursacht jedoch Probleme, wenn er auf einem kleinen Bildschirm angezeigt wird.

Derzeit bleibt die Schaltfläche unabhängig von der Seitenbreite gleich breit und bewirkt, dass die Seite horizontal scrollt, wenn sie zu schmal ist.

Ich möchte den Text wie in einem Inline-Block-Element umschließen. Ich habe das im CSS spezifiziert, aber es scheint nicht zu funktionieren.

input{background:#deaded;padding:10px 30px;display:inline-block;border-radius:5px} 

<input type="submit" value="This is where the slogan goes" /> 

Answer 1

Sie können white-space: normal; verwenden.

input { 
 
    background: #deaded; 
 
    padding: 10px 30px; 
 
    display: inline-block; 
 
    border-radius: 5px; 
 
    white-space: normal; 
 
}

<input type="submit" value="This is where the slogan goes" />