Change Angular Timepicker Schriftgröße - Css, Angularjs, Twitter-Bootstrap, Winkel-Ui-Bootstrap, eckig-Bootstrap

Ich benutze die eckiger Bootstrap-Timepicker aber ich kann die Schriftgröße nicht ändern, wodurch der Text wie folgt abgeschnitten wird:

HTML:

        <div class="col-md-1">
<div class="input-group">
<label>End:</label>
<timepicker ng-model="filter_endtime" ng-change="changed()" hour-step="hstep"
minute-step="mstep" show-meridian="ismeridian"></timepicker>
</div>
</div>

Wenn ich das Element in einem Browser inspiziere, kann ich die Schriftgröße in .form-control auf 12px ändern.

.form-control {
display: block;
width: 100%;
height: 34px;
padding: 6px 12px;
font-size: 14px;
line-height: 1.4285;
color: #555;
background-color: #fff;
background-image: none;
border: 1px solid #ccc;
border-radius: 4px;
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
box-shadow: inset 0px 1px 1px rgba(0,0,0,0.075);
-webkit-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}

Gibt es überhaupt eine Möglichkeit, die Schriftgröße im Timepicker-Steuerelement zu überschreiben?

Ich habe es versucht

font-size: 12px !important;

als eine andere Klasse in der Eingabegruppe, aber es sieht so aus:

Antworten:

0 für die Antwort № 1

Ändern Sie die Formatvorlagenformate in Ihrer Bootstrap-Datei.

.form-control{
font-size:12px
}

oder verwenden Sie den Inline-Stil

<timepicker style="font-size:12px;" ng-model="filter_endtime" ng-change="changed()"
hour-step="hstep" minute-step="mstep" show-meridian="ismeridian">
</timepicker>

---

0 für die Antwort № 2

Stellen Sie css einfach auf .bootstrap-timepicker-hour und .bootstrap-timepicker-minute ein:

bootstrap-timepicker-hour{
font-size:12px !important;
}

Versuchen Sie es in der Geige

http://jsfiddle.net/sqe64a09/

---