Strange Issue with Fieldset & CSS in IE9
Strange Issue with Fieldset & CSS in IE9
(OP)
So I have an <asp:Panel> control with it's GroupingText property set which will end up rending as a <fieldset> control.
Inside this Panel/Fieldset I have a button and have it's style property set to "float: right".
If I view this in IE8 or Chrome the button shows up fine but when I view it in IE9, the button disappears.
I can view the source and see that the element is still actually there, it's just not displayed.
Anyone else come across this issue or know why it would be happening?
Example:
<asp:Panel ID="pnDateRange" runat="server" GroupingText="Date Range" Width="500" DefaultButton="btnFilter">
Inside this Panel/Fieldset I have a button and have it's style property set to "float: right".
If I view this in IE8 or Chrome the button shows up fine but when I view it in IE9, the button disappears.
I can view the source and see that the element is still actually there, it's just not displayed.
Anyone else come across this issue or know why it would be happening?
Example:
<asp:Panel ID="pnDateRange" runat="server" GroupingText="Date Range" Width="500" DefaultButton="btnFilter">
<asp:Button ID="btnFilter" runat="server" Text="Filter" style="float: right" />
</asp:Panel>
RE: Strange Issue with Fieldset & CSS in IE9
----------------------------------
Phil AKA Vacunita
----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.
Web & Tech
RE: Strange Issue with Fieldset & CSS in IE9
<div id="MainContentPlaceHolder_pnDateRange" onkeypress="javascript:return WebForm_FireDefaultButton(event, 'MainContentPlaceHolder_btnFilter')" style="width:500px;">
<fieldset>
<legend>
Date Range
</legend>
<br />
<input type="button" name="ctl00$MainContentPlaceHolder$btnFilter" value="Filter" onclick="javascript:__doPostBack('ctl00$MainContentPlaceHolder$btnFilter','')" id="MainContentPlaceHolder_btnFilter" class="button2" style="float: right" />
</fieldset>
</div>
RE: Strange Issue with Fieldset & CSS in IE9
Check that IE9 is not in some kind of compatibility mode. Press F12 to bring up its debug options.
----------------------------------
Phil AKA Vacunita
----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.
Web & Tech
RE: Strange Issue with Fieldset & CSS in IE9
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
If I exclude that then other elements of the site don't display properly.
Besides that, here's whats in the CSS for "button2":
.button2
{
display:inline-block;
cursor:pointer;
color:#0B55C4;
font-weight:bold;
width:125px;
height:30px;
text-decoration:none;
text-align:center;
vertical-align:middle;
line-height:8px;
margin:2px;
font-family: Arial, Tahoma, Verdana;
font-size: 11px;
}
RE: Strange Issue with Fieldset & CSS in IE9
If I remove it, then the button will display properly but like I said, it causes other issues so I'm going to leave it as is for now.
Thanks for the help!
RE: Strange Issue with Fieldset & CSS in IE9
http://validator.w3.org/
And not to cause more of a headache, but you may also want to be checking IE10 and IE11.
RE: Strange Issue with Fieldset & CSS in IE9
http://stackoverflow.com/questions/14637943/what-i...
I find telling newer browser versions to try to emulate lesser versions never works properly.
"In complete darkness we are all the same, it is only our knowledge and wisdom that separates us, don't let your eyes deceive you."
"If a shortcut was meant to be easy, it wouldn't be a shortcut, it would be the way!"
Free Electronic Dance Music