For some reason password fields are appearing as blank (or white) characters in IE8 for a site I'm working on.
Both these screenshots have a long password entered. The second one I have highlighted it so you can see it recognizes the characters, they just appear as empty. I also included the IE debug trace.
Full size - http://i.stack.imgur.com/hUd4I.png
Full size - http://i.stack.imgur.com/tOkn9.png
In other browsers they show up fine. I have never seen anything like this before, any ideas?
HTML header:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
Only custom CSS for inputs:
body, input, button, select, textarea {
font-family: 'Open Sans' , sans-serif;
font-size: 13px;
}
I had the same issue. I fixed it by adding a hack in my CSS to override the input font from Open Sans to Arial:
.form-horizontal input {
*background-color: #ffffff !important;
*color: #464646 !important;
*font-family: Arial !important;
}
It has to be a character issue with Google Font and IE where the password dots are missing from the font or something like that.
This is how I solved it
<?php echo Form::password('password', NULL, array('title'=>'', 'class' => 'input-block-level', 'tabindex' => '2', 'placeholder'=>'Password', 'title' => 'Password', 'style' => 'font-family:arial, serif;')) ?><!-- the font family arial serif is a fix for IE8 password placeholder text -->
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With