Passwords showing up as white (or not at all) in I

2020-02-25 23:52发布

站内问答 / HTML/CSS
820 3 4

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

Unhighlighted

Full size - http://i.stack.imgur.com/tOkn9.png

Password highlighted

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;
}

3条回答
Root（大扎）
2楼-- · 2020-02-26 00:18

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.

查看更多
0人赞 添加讨论(0) 举报
ゆ 、 Hurt°
3楼-- · 2020-02-26 00:25

I had a similar problem - my text on all input[type='text'] elements was white. Moving the mouse cursor out of the modal div caused the text to appear. I suspected filter and transition CSS rules from Twitter Bootstrap to cause the problem - and it was it. I removed hide and fade classes from my modal window: <div class="modal hide fade" /> and it works fine now. Give it a try if your modal is animated.

查看更多
0人赞 添加讨论(0) 举报
小情绪 Triste *
4楼-- · 2020-02-26 00:30

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 -->
查看更多
0人赞 添加讨论(0) 举报
登录 后发表回答
相关问题
查看全部
相关文章
查看全部
收藏的人(4)