paßt Ich verwende md-button
, den Text enthältmd-Taste Schriftgröße verkleinert auf Knopfgröße
das Problem ist, wenn ich in niedriger Auflösung bin der Text abgeschnitten wird, und ich kann die richtige Lösung nicht gefunden zu beheben es
wenn Sie bitte vorschlagen, wie das zu tun ist.
angebracht ich einen Screenshot in hohen und niedrigen Auflösung + die CSS und HTML
<md-dialog id="new_test_draft_dialog" flex=40 flex-md=50 flex-sm=60 flex-xs=80>
<div>
<div layout-padding>
<h2>Save Changes?</h2>
<div style="padding:5px;" layout-padding>
<div layout="row" layout-align="center center">
<md-button ng-click="draftDialogService.cancel()" class="button_type_1 active">Continue</md-button>
<md-button ng-click="draftDialogService.hide()" class="button_type_1 active">Discard</md-button>
<md-button ng-click="draftDialogService.hide(saveDraft())" class="button_type_1 active">Save draft</md-button>
</div>
</div>
</div>
</div>
</md-dialog>
Die CSS:
/* Buttons */
.button_type.md-button,
.button_type,
.button_type_1 {
border: 3px solid #fff;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
-moz-background-clip: padding;
-webkit-background-clip: padding-box;
background-clip: padding-box;
padding: 5px 5px;
color: #fff;
display: inline-block;
text-decoration: none;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
word-wrap: break-word;
}
Dank geprüft ich Ihre Lösung, aber es hat nichts ändern, wird der Text auf den Tasten noch geschnitten wird ... –
@LiadLivnat Wirklich? Wenn Sie in Ihrer Frage "niedrige Auflösung" sagen, meinen Sie eine kleine Bildschirmgröße? Bei meinem Beispiel sehen die Tasten bei einer kleinen Bildschirmgröße gut aus. –
Ich meine, dass die Seite reagiert, also ja niedrige Auflösung ist 1175, ich habe den Code aktualisiert, vielleicht hat es keinen Einfluss, da es in einem Modal ist? –