Problem with ASP.NET menu (position:fixed) in IE7

[Guest]

Hello,

I have a problem with the ASP.NET menu when rendered in IE7:
If the menu is inside a div with style="position:fixed;top:3em;", all the
submenus also have the top:3em.

Is this an IE7 issue (works fine in Firefox)? How can I achieve that the
submenus have no top offset?

Test code:

<div style="position:fixed;top:3em;">
<asp:Menu ID="Menu1" runat="server"
DataSourceID="SiteMapDataSource1" Orientation="Horizontal" CssClass="menu">
</asp:Menu>
<asp:SiteMapDataSource ID="SiteMapDataSource1" runat="server"
ShowStartingNode="False" />


</div>

Any ideas? Thanks a lot.

 

[clintonG]

I'm finding I still need separate stylesheets for IE7.

What is even more incredulous is the apparent appointment of one of
Microsoft's lead managers on the IE development group who was responsible
for the IE garbage in the first place and who is now being considered as an
appointment to lead the W3C committee on standards for web development.

<%= Clinton Gallagher
NET csgallagher AT metromilwaukee.com
URL http://clintongallagher.metromilwaukee.com/
MAP http://wikimapia.org/#y=43038073&x=-88043838&z=17&l=0&m=h

 

[Steven Cheng[MSFT]]

Hello dpomt,

As for the Menu control within a fixed postion <div>, do you mean that each
Menu item's rendered html content will contains the "top:3em" style? Based
on my test(on a XP sp2 box with IIS5/ASP.NET 2.0), when I put an Menu into
a fixed position div as below:

===========
<div style="position:fixed;top:3em;">
<asp:Menu ID="Menu1" runat="server" Orientation="Horizontal" >
<Items>
<asp:MenuItem Text="New Item" Value="New Item">
<asp:MenuItem Text="New Item" Value="New Item">
<asp:MenuItem Text="New Item" Value="New
Item"></asp:MenuItem>
</asp:MenuItem>
<asp:MenuItem Text="New Item" Value="New
Item"></asp:MenuItem>
</asp:MenuItem>
<asp:MenuItem Text="New Item" Value="New Item">
<asp:MenuItem Text="New Item" Value="New Item">
<asp:MenuItem Text="New Item" Value="New
Item"></asp:MenuItem>
</asp:MenuItem>
<asp:MenuItem Text="New Item" Value="New
Item"></asp:MenuItem>
</asp:MenuItem>
<asp:MenuItem Text="New Item" Value="New Item">
<asp:MenuItem Text="New Item" Value="New Item">
<asp:MenuItem Text="New Item" Value="New
Item"></asp:MenuItem>
</asp:MenuItem>
<asp:MenuItem Text="New Item" Value="New
Item"></asp:MenuItem>
</asp:MenuItem>
</Items>
</asp:Menu>
</div>
=======================

there does have any other "top:3em" in the output html content. also, I
noticted that you've applied the "menu" cssclass for your Menu control. Is
it possible that the css class contains the certain "top:3em" setting?

Sincerely,

Steven Cheng

Microsoft MSDN Online Support Lead



==================================================

Get notification to my posts through email? Please refer to
http://msdn.microsoft.com/subscriptions/managednewsgroups/default.aspx#notif
ications.



Note: The MSDN Managed Newsgroup support offering is for non-urgent issues
where an initial response from the community or a Microsoft Support
Engineer within 1 business day is acceptable. Please note that each follow
up response may take approximately 2 business days as the support
professional working with you may need further investigation to reach the
most efficient resolution. The offering is not appropriate for situations
that require urgent, real-time or phone-based interactions or complex
project analysis and dump analysis issues. Issues of this nature are best
handled working with a dedicated Microsoft Support Engineer by contacting
Microsoft Customer Support Services (CSS) at
http://msdn.microsoft.com/subscriptions/support/default.aspx.

==================================================



This posting is provided "AS IS" with no warranties, and confers no rights.

 

[Guest]

Hello Steven,

thanks for your reply.
Concerning the menu class, it is not the problem. I have it defined as .menu
{top:0em;}.

I guess my description of the problem was not very good:
no additional html code with "top:3em" is rendered, but that em top margin
is "there" (visible) in Internet Explorer 7 not only at top of the page but
also at top of the submenus.
May be it is not a problem of the ASP.NET but of the IE rendering engine?

Change the value to top:10em and retest. When you scroll over a menu item
and the submenu is displayed (with additional margin of 10em), you see better
what I mean.

Thanks for further help.

 

[Steven Cheng[MSFT]]

Thanks for your followup Dpomt,

I'll perform some further test and let you know my result.

Sincerely,

Steven Cheng

Microsoft MSDN Online Support Lead


This posting is provided "AS IS" with no warranties, and confers no rights.

 

[Guest]

Hello Steven,

any news on that issue?

Best regards
dpomt

 

[Steven Cheng[MSFT]]

Thanks for your followup.

Sorry that I've been absent due to some urgent the previous days. I'll soon
perform test and let you know the result.

Thanks for your patience and understanding.

Sincerely,

Steven Cheng

Microsoft MSDN Online Support Lead


This posting is provided "AS IS" with no warranties, and confers no rights.

 

[Steven Cheng[MSFT]]

Hello dpomt,

I've just managed to perform some local tests and I did get the problem
behavior in IE7 has you described. I've also tested in Firefox and Opera
browsers and didn't meet this problem. Also, based on discussing with some
other ASP.NET engineers, this is likely due to the IE's css style support
on html table since the default ASP.NET navigation controls (such as menu)
use html table to construct its items and structure, which sometimes is
problemtic in IE's rendering. I've been suggested the CSS Control Adapter
which has implemented some existing CSS friendly control render adapter for
ASP.NET navigation controls, you can have a look to see whether this will
helps some on this issue.

#CSS Control Adapter Toolkit for ASP.NET 2.0
http://weblogs.asp.net/scottgu/archive/2006/05/02/CSS-Control-Adapter-Toolki
t-for-ASP.NET-2.0-.aspx

For the current limitation, you may have to avoid such a fixed position
style div when using the default style Navigation menu control.

Thanks for your understanding.

Sincerely,

Steven Cheng

Microsoft MSDN Online Support Lead


This posting is provided "AS IS" with no warranties, and confers no rights.

 

[Guest]

Hello Steven,

thanks for you reply. So am I right assuming this is an IE7 bug in its CSS
engine?

I have tested the CSS Control Adapters before but I could not use them due
to some limitations.
However, after reading you post I decided to extend the MenuAdapter
(contained in the CSS Control Adapters Kit) to fit my needs. I have just done
this and it works great.

Thanks for your help.
Best regards
dpomt

 

[Steven Cheng[MSFT]]

Thanks for your folllowup and share the info with us.

Sincerely,

Steven Cheng

Microsoft MSDN Online Support Lead