Strange Issue with Fieldset & CSS in IE9 1

[BOUSMANBE]

So I have an <aspanel> 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:
<aspanel ID="pnDateRange" runat="server" GroupingText="Date Range" Width="500" DefaultButton="btnFilter">

<asp:Button ID="btnFilter" runat="server" Text="Filter" style="float: right" />​

</aspanel>

 

[vacunita]

Probably some rule in your CSS that either IE9 ignores as the other 2 don't or viceversa. Since Browsers only see the rendered HTML and CSS and never the server side code, post your final HTML as seen from the View Source option in IE9 so we may assist. The ASP in this case is mostly irrelevant.


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

 

[BOUSMANBE]

Here's the source code, there's a table that I also have between the </legend> and <br> tags but it was a lot of extra text and I don't think it's relevant:

<div id="MainContentPlaceHolder_pnDateRange" onkeypress="javascript:return WebForm_FireDefaultButton(event, &#39;MainContentPlaceHolder_btnFilter&#39" style="width:500px;">
<fieldset>
<legend>
Date Range
</legend>
<br />
<input type="button" name="ctl00$MainContentPlaceHolder$btnFilter" value="Filter" onclick="javascript:__doPostBack(&#39;ctl00$MainContentPlaceHolder$btnFilter&#39;,&#39;&#39" id="MainContentPlaceHolder_btnFilter" class="button2" style="float: right" />
</fieldset>
</div>

 

[vacunita]

Nothing wrong with that HTML. Any other CSS that may be applied to it?

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

 

[BOUSMANBE]

In my Master page, I have this line of code:

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

 

[BOUSMANBE]

It looks like it has to do with that <meta> tag.

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!

 

[spamjim]

You should run the page through a HTML validator to make sure everything is in order, such as the doctype. If the doctype is not specified or something else on the page is not valid, the browser will go into quirks mode and all bets are off. The "X-UA-Compatible" meta tag cannot function properly without a defined <!doctype>.

http://validator.w3.org/

And not to cause more of a headache, but you may also want to be checking IE10 and IE11.

 

[1DMF]

I always use IE=Edge, to ensure the browser runs in its most standard compliance mode possible

http://stackoverflow.com/questions/...ompatible-when-it-references-ie-edge-chrome-1

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