INTELLIGENT WORK FORUMS
FOR COMPUTER PROFESSIONALS

Log In

Come Join Us!

Are you a
Computer / IT professional?
Join Tek-Tips Forums!
  • Talk With Other Members
  • Be Notified Of Responses
    To Your Posts
  • Keyword Search
  • One-Click Access To Your
    Favorite Forums
  • Automated Signatures
    On Your Posts
  • Best Of All, It's Free!

*Tek-Tips's functionality depends on members receiving e-mail. By joining you are opting in to receive e-mail.

Posting Guidelines

Promoting, selling, recruiting, coursework and thesis posting is forbidden.

Jobs

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">
<asp:Button ID="btnFilter" runat="server" Text="Filter" style="float: right" />
</asp:Panel>

RE: Strange Issue with Fieldset & CSS in IE9

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

RE: Strange Issue with Fieldset & CSS in IE9

(OP)
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>

RE: Strange Issue with Fieldset & CSS in IE9

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

RE: Strange Issue with Fieldset & CSS in IE9

(OP)
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;
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

(OP)
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!

RE: Strange Issue with Fieldset & CSS in IE9

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.

RE: Strange Issue with Fieldset & CSS in IE9

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

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

Red Flag This Post

Please let us know here why this post is inappropriate. Reasons such as off-topic, duplicates, flames, illegal, vulgar, or students posting their homework.

Red Flag Submitted

Thank you for helping keep Tek-Tips Forums free from inappropriate posts.
The Tek-Tips staff will check this out and take appropriate action.

Reply To This Thread

Posting in the Tek-Tips forums is a member-only feature.

Click Here to join Tek-Tips and talk with other members!

Resources

Close Box

Join Tek-Tips® Today!

Join your peers on the Internet's largest technical computer professional community.
It's easy to join and it's free.

Here's Why Members Love Tek-Tips Forums:

Register now while it's still free!

Already a member? Close this window and log in.

Join Us             Close