Velocity Reviews

Velocity Reviews (http://www.velocityreviews.com/forums/index.php)
-   ASP .Net Web Controls (http://www.velocityreviews.com/forums/f63-asp-net-web-controls.html)
-   -   Menu control - width and valign (http://www.velocityreviews.com/forums/t780246-menu-control-width-and-valign.html)

Leslie 10-03-2007 08:31 PM

Menu control - width and valign
 
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 Cheng[MSFT] 10-04-2007 03:21 AM

RE: Menu control - width and valign
 
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/archi...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>
>
>



Leslie 10-04-2007 07:18 PM

RE: Menu control - width and valign
 
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%" 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/archi...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>
> >
> >

>
>


Steven Cheng[MSFT] 10-05-2007 02:09 AM

RE: Menu control - width and valign
 
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-62F2ED783ADE@microsoft.com>

<LyzjnWjBIHA.240@TK2MSFTNGHUB02.phx.gbl>
>Subject: RE: Menu control - width and valign
>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%"

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/archi...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>
>> >
>> >

>>
>>

>




All times are GMT. The time now is 08:24 AM.

Powered by vBulletin®. Copyright ©2000 - 2014, vBulletin Solutions, Inc.
SEO by vBSEO ©2010, Crawlability, Inc.