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

Popular posts from this blog

java - activate/deactivate sonar maven plugin by profile? -

python - TypeError: can only concatenate tuple (not "float") to tuple -

java - What is the difference between String. and String.this. ? -