html - Styling a disabled input with css only -
i have sort of strange situation. i'm trying style disabled input button because have annoying hover turning text white. makes confusing user because acting normal button.
i have tried few things, css , few jquery things. keep in css if @ posable.
this html, sorry in larvel form helper.
{{ form::submit('change', array_merge($design_project->is_locked ? ['disabled' => 'disabled'] : [], ['class' => 'btn btn-blue span3'])) }}
and browser generates
<input disabled="disabled" class="btn btn-blue span3" type="submit" value="change">
and working on
.btn:hover input[disabled], .btn:active input[disabled], .btn:focus input[disabled]{ color:green }
any wonderful!
use css (jsfiddle example):
input:disabled.btn:hover, input:disabled.btn:active, input:disabled.btn:focus { color: green }
you have write outer element on left , inner element on right.
.btn:hover input:disabled
select disabled input elements contained in element class btn
hovered user.
i prefer :disabled
on [disabled]
, see question discussion: should use css :disabled pseudo-class or [disabled] attribute selector or matter of opinion?
by way, laravel (php) generates html - not browser.
Comments
Post a Comment