为什么在Chrome的手风琴上方没有显示该消息? [英] Why the message doesn't appear above the accordion in Chrome?

问题描述

我正在尝试新的HTML5验证，当我尝试使用< input> 标记内的 required 属性时，消息 This field can'不能为空显示不正确.当我在Twitter Bootstrap手风琴中插入此< input> 标记，并尝试使用Google Chrome浏览器(第23版)提交表单时，就会出现问题.

I am trying the new HTML5 validations and when I try to use the required attribute inside the <input> tag, the message This field can't be blank is not being displayed correctly. The problem appears when I insert a this <input> tag within a Twitter Bootstrap accordion and I try to submit the form with Google Chrome (v. 23).

在其他浏览器上，该消息显示在手风琴上方(我在Firefox 17中对其进行了测试)，但是在Chrome浏览器中，由于手风琴，消息的一半被隐藏了.

With other browsers, the message appear above the accordion (I tested it in Firefox 17) but with Chrome, half of the message is hidden because of the accordion.

此 JSFiddle 显示了此问题.

我该如何解决该问题?为什么会这样?

How can I solve the problem? Why is this happening?

推荐答案

问题是您在 div#collapseOne 元素中设置了 overflow:hidden; 属性，因此您只需要将其设置为 visible .

The problem was you had an overflow:hidden; property set in your div#collapseOne element, so you just need to set it to visible.

#collapseOne {
    overflow:visible;            
}

请参见 jsfiddle .

这篇关于为什么在Chrome的手风琴上方没有显示该消息?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！