|
code
newsgroups
|
|||||||||||||||||||||||
|
|||||||||||||||||||||||
Menu control - width and valignstandards compliant html. When using the Menu control I have found a couple of problems regarding the width and the valign attributes. When I specify a StaticMenuStyle.Width of 188 the resulting html is generated with two width attributes as in: <table border="0" cellpadding="0" cellspacing="0" width="100%" width="188"> When I build a menu item that references an ImageUrl the resulting html is generated with the valign attribute as in: <img src="spacer.gif" alt="" valign="middle" /> My understanding is that the valign attribute is not valid for the img element. Is there a way I can remove these two problem cases via my code or is it something that cannot be fixed for now? I am using Visual Studio 2005 with the .NETFramework 2.0. The source page used to generate these problems is included below. Thanks, Leslie <%@ Page Language="C#" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <script runat="server"> protected void Page_Load(object sender, EventArgs e) { MenuItem miHeader = null; MenuItem mi; mi = new MenuItem("", "", "spacer.gif", ""); mi.Selectable = false; mnuSpacer.Visible = true; mnuSpacer.Items.Add(mi); mi = new MenuItem("First Section", "", "", ""); mi.Selectable = false; miHeader = mi; mnuLinks.Visible = true; mnuLinks.Items.Add(mi); mi = new MenuItem("Microsoft", "", "", "http://www.microsoft.com"); mi.Selectable = true;miHeader.ChildItems.Add(mi); mnuLinks.StaticDisplayLevels = 2; } // protected void Page_Load(object sender, EventArgs e) </script> <html xmlns="http://www.w3.org/1999/xhtml" > <head runat="server"> <title>Untitled Page</title> </head> <body> <form id="form1" runat="server"> <div> <asp:menu id="mnuSpacer" runat="server"> </asp:menu> <br /> <br /> <asp:menu id="mnuLinks" runat="server"> <staticmenustyle width="188px" /> </asp:menu> </div> </form> </body> </html> Hi Leslie,
From your description, you're using the ASP.NET 2.0 Menu control and meet some html rendering issue, correct? According to the two problems you mentioned, I have performed tests (via the code you provided) and here is what I found: it seems the problem maybe specific to environment. In my test enviornment(windows XP pro sp2 with VS 2005 SP1 and IE7), the menu content will displayed without those unexpected elements/attributes you mentioned. For example, for the image, it won't add "valign" attribute, but use the "vertical-align" style attributes as below: ========= <img src="spacer.gif" alt="" style="border-style:none;vertical-align:middle;" /> =========== Also, for width, I didn't find the following like html fragment: <table border="0" cellpadding="0" cellspacing="0" width="100%" width="188"> in my test page, it won't render out additionl "width" attribute, only the "100%" exists. Therefore, I also suggest you try some other test environment(such as browser ...) to see whether it behaves different. BTW, for ASP.NET 2.0 navigation control, the dev team provides an additional CSS friendtly adapter which can help you make the navigation controls(such as menu, treeview) be rendered with some more brower compatible and CSS compatible html elements: #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 You can also have a look to see whether it helps. Sincerely, Steven Cheng Microsoft MSDN Online Support Lead This posting is provided "AS IS" with no warranties, and confers no rights. -------------------- Show quote >From: =?Utf-8?B?TGVzbGll?= <mason@newsgroup.nospam> >Subject: Menu control - width and valign >Date: Wed, 3 Oct 2007 13:31:02 -0700 > >I have a customer that is very concerned with having all web sites present >standards compliant html. When using the Menu control I have found a couple >of problems regarding the width and the valign attributes. > >When I specify a StaticMenuStyle.Width of 188 the resulting html is >generated with two width attributes as in: ><table border="0" cellpadding="0" cellspacing="0" width="100%" width="188"> > >When I build a menu item that references an ImageUrl the resulting html is >generated with the valign attribute as in: ><img src="spacer.gif" alt="" valign="middle" /> >My understanding is that the valign attribute is not valid for the img >element. > >Is there a way I can remove these two problem cases via my code or is it >something that cannot be fixed for now? I am using Visual Studio 2005 with >the .NETFramework 2.0. > >The source page used to generate these problems is included below. > >Thanks, > >Leslie > ><%@ Page Language="C#" %> > ><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" >"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> > ><script runat="server"> > protected void Page_Load(object sender, EventArgs e) > { > MenuItem miHeader = null; > MenuItem mi; > mi = new MenuItem("", "", "spacer.gif", ""); > mi.Selectable = false; > mnuSpacer.Visible = true; > mnuSpacer.Items.Add(mi); > > mi = new MenuItem("First Section", "", "", ""); > mi.Selectable = false; > miHeader = mi; > mnuLinks.Visible = true; > mnuLinks.Items.Add(mi); > mi = new MenuItem("Microsoft", "", "", "http://www.microsoft.com"); > mi.Selectable = true; > miHeader.ChildItems.Add(mi); > mnuLinks.StaticDisplayLevels = 2; > > } // protected void Page_Load(object sender, EventArgs e) > ></script> > ><html xmlns="http://www.w3.org/1999/xhtml" > ><head runat="server"> > <title>Untitled Page</title> ></head> ><body> > <form id="form1" runat="server"> > <div> > <asp:menu id="mnuSpacer" runat="server"> > </asp:menu> > <br /> > <br /> > <asp:menu id="mnuLinks" runat="server"> > <staticmenustyle width="188px" /> > </asp:menu> > > </div> > </form> ></body> ></html> > > Steven,
Thanks for checking out the details. I had been using a product called CSE HTML Validator to check the HTML. When I checked the html that was sent to IE I received the same results you received. In addition, I found out how to configure the CSE tool to identify itself as other browsers. Once that was done the Validator tool receives html that is similar to the html that IE receives. Leslie Show quote "Steven Cheng[MSFT]" wrote: > Hi Leslie, > > From your description, you're using the ASP.NET 2.0 Menu control and meet > some html rendering issue, correct? > > According to the two problems you mentioned, I have performed tests (via > the code you provided) and here is what I found: > > it seems the problem maybe specific to environment. In my test > enviornment(windows XP pro sp2 with VS 2005 SP1 and IE7), the menu content > will displayed without those unexpected elements/attributes you mentioned. > For example, for the image, it won't add "valign" attribute, but use the > "vertical-align" style attributes as below: > > ========= > <img src="spacer.gif" alt="" > style="border-style:none;vertical-align:middle;" /> > =========== > > Also, for width, I didn't find the following like html fragment: > > <table border="0" cellpadding="0" cellspacing="0" width="100%" width="188"> > > in my test page, it won't render out additionl "width" attribute, only the > "100%" exists. Therefore, I also suggest you try some other test > environment(such as browser ...) to see whether it behaves different. > > BTW, for ASP.NET 2.0 navigation control, the dev team provides an > additional CSS friendtly adapter which can help you make the navigation > controls(such as menu, treeview) be rendered with some more brower > compatible and CSS compatible html elements: > > #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 > > You can also have a look to see whether it helps. > > Sincerely, > > Steven Cheng > > Microsoft MSDN Online Support Lead > > > This posting is provided "AS IS" with no warranties, and confers no rights. > > -------------------- > > >From: =?Utf-8?B?TGVzbGll?= <mason@newsgroup.nospam> > >Subject: Menu control - width and valign > >Date: Wed, 3 Oct 2007 13:31:02 -0700 > > > > >I have a customer that is very concerned with having all web sites present > >standards compliant html. When using the Menu control I have found a > couple > >of problems regarding the width and the valign attributes. > > > >When I specify a StaticMenuStyle.Width of 188 the resulting html is > >generated with two width attributes as in: > ><table border="0" cellpadding="0" cellspacing="0" width="100%" width="188"> > > > >When I build a menu item that references an ImageUrl the resulting html is > >generated with the valign attribute as in: > ><img src="spacer.gif" alt="" valign="middle" /> > >My understanding is that the valign attribute is not valid for the img > >element. > > > >Is there a way I can remove these two problem cases via my code or is it > >something that cannot be fixed for now? I am using Visual Studio 2005 with > >the .NETFramework 2.0. > > > >The source page used to generate these problems is included below. > > > >Thanks, > > > >Leslie > > > ><%@ Page Language="C#" %> > > > ><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" > >"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> > > > ><script runat="server"> > > protected void Page_Load(object sender, EventArgs e) > > { > > MenuItem miHeader = null; > > MenuItem mi; > > mi = new MenuItem("", "", "spacer.gif", ""); > > mi.Selectable = false; > > mnuSpacer.Visible = true; > > mnuSpacer.Items.Add(mi); > > > > mi = new MenuItem("First Section", "", "", ""); > > mi.Selectable = false; > > miHeader = mi; > > mnuLinks.Visible = true; > > mnuLinks.Items.Add(mi); > > mi = new MenuItem("Microsoft", "", "", "http://www.microsoft.com"); > > mi.Selectable = true; > > miHeader.ChildItems.Add(mi); > > mnuLinks.StaticDisplayLevels = 2; > > > > } // protected void Page_Load(object sender, EventArgs e) > > > ></script> > > > ><html xmlns="http://www.w3.org/1999/xhtml" > > ><head runat="server"> > > <title>Untitled Page</title> > ></head> > ><body> > > <form id="form1" runat="server"> > > <div> > > <asp:menu id="mnuSpacer" runat="server"> > > </asp:menu> > > <br /> > > <br /> > > <asp:menu id="mnuLinks" runat="server"> > > <staticmenustyle width="188px" /> > > </asp:menu> > > > > </div> > > </form> > ></body> > ></html> > > > > > > Thanks for your reply Leslie,
Glad that you've found out it. BTW, I also haven't expected that you're using a validator tool to simulate the browser:) Sincerely, Steven Cheng Microsoft MSDN Online Support Lead This posting is provided "AS IS" with no warranties, and confers no rights. -------------------- >References: <8FEBB353-5235-4299-9840-62F2ED783***@microsoft.com> <LyzjnWjBIHA.***@TK2MSFTNGHUB02.phx.gbl>Show quote >Subject: RE: Menu control - width and valign width="188">>Date: Thu, 4 Oct 2007 12:18:00 -0700 > >Steven, > >Thanks for checking out the details. I had been using a product called CSE >HTML Validator to check the HTML. When I checked the html that was sent to IE >I received the same results you received. In addition, I found out how to >configure the CSE tool to identify itself as other browsers. Once that was >done the Validator tool receives html that is similar to the html that IE >receives. > >Leslie > >"Steven Cheng[MSFT]" wrote: > >> Hi Leslie, >> >> From your description, you're using the ASP.NET 2.0 Menu control and meet >> some html rendering issue, correct? >> >> According to the two problems you mentioned, I have performed tests (via >> the code you provided) and here is what I found: >> >> it seems the problem maybe specific to environment. In my test >> enviornment(windows XP pro sp2 with VS 2005 SP1 and IE7), the menu content >> will displayed without those unexpected elements/attributes you mentioned. >> For example, for the image, it won't add "valign" attribute, but use the >> "vertical-align" style attributes as below: >> >> ========= >> <img src="spacer.gif" alt="" >> style="border-style:none;vertical-align:middle;" /> >> =========== >> >> Also, for width, I didn't find the following like html fragment: >> >> <table border="0" cellpadding="0" cellspacing="0" width="100%" >> http://weblogs.asp.net/scottgu/archive/2006/05/02/CSS-Control-Adapter-Toolki>> in my test page, it won't render out additionl "width" attribute, only the >> "100%" exists. Therefore, I also suggest you try some other test >> environment(such as browser ...) to see whether it behaves different. >> >> BTW, for ASP.NET 2.0 navigation control, the dev team provides an >> additional CSS friendtly adapter which can help you make the navigation >> controls(such as menu, treeview) be rendered with some more brower >> compatible and CSS compatible html elements: >> >> #CSS Control Adapter Toolkit for ASP.NET 2.0 >> Show quote >> t-for-ASP.NET-2.0-.aspx width="188">>> >> You can also have a look to see whether it helps. >> >> Sincerely, >> >> Steven Cheng >> >> Microsoft MSDN Online Support Lead >> >> >> This posting is provided "AS IS" with no warranties, and confers no rights. >> >> -------------------- >> >> >From: =?Utf-8?B?TGVzbGll?= <mason@newsgroup.nospam> >> >Subject: Menu control - width and valign >> >Date: Wed, 3 Oct 2007 13:31:02 -0700 >> >> > >> >I have a customer that is very concerned with having all web sites present >> >standards compliant html. When using the Menu control I have found a >> couple >> >of problems regarding the width and the valign attributes. >> > >> >When I specify a StaticMenuStyle.Width of 188 the resulting html is >> >generated with two width attributes as in: >> ><table border="0" cellpadding="0" cellspacing="0" width="100%" Show quote >> > >> >When I build a menu item that references an ImageUrl the resulting html is >> >generated with the valign attribute as in: >> ><img src="spacer.gif" alt="" valign="middle" /> >> >My understanding is that the valign attribute is not valid for the img >> >element. >> > >> >Is there a way I can remove these two problem cases via my code or is it >> >something that cannot be fixed for now? I am using Visual Studio 2005 with >> >the .NETFramework 2.0. >> > >> >The source page used to generate these problems is included below. >> > >> >Thanks, >> > >> >Leslie >> > >> ><%@ Page Language="C#" %> >> > >> ><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" >> >"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> >> > >> ><script runat="server"> >> > protected void Page_Load(object sender, EventArgs e) >> > { >> > MenuItem miHeader = null; >> > MenuItem mi; >> > mi = new MenuItem("", "", "spacer.gif", ""); >> > mi.Selectable = false; >> > mnuSpacer.Visible = true; >> > mnuSpacer.Items.Add(mi); >> > >> > mi = new MenuItem("First Section", "", "", ""); >> > mi.Selectable = false; >> > miHeader = mi; >> > mnuLinks.Visible = true; >> > mnuLinks.Items.Add(mi); >> > mi = new MenuItem("Microsoft", "", "", "http://www.microsoft.com"); >> > mi.Selectable = true; >> > miHeader.ChildItems.Add(mi); >> > mnuLinks.StaticDisplayLevels = 2; >> > >> > } // protected void Page_Load(object sender, EventArgs e) >> > >> ></script> >> > >> ><html xmlns="http://www.w3.org/1999/xhtml" > >> ><head runat="server"> >> > <title>Untitled Page</title> >> ></head> >> ><body> >> > <form id="form1" runat="server"> >> > <div> >> > <asp:menu id="mnuSpacer" runat="server"> >> > </asp:menu> >> > <br /> >> > <br /> >> > <asp:menu id="mnuLinks" runat="server"> >> > <staticmenustyle width="188px" /> >> > </asp:menu> >> > >> > </div> >> > </form> >> ></body> >> ></html> >> > >> > >> >> >  |
|||||||||||||||||||||||
Other interesting topics