CSS Improvements in Visual Studio 2010

One of the major areas of work in ASP.NET 4 Beta 2 has been around rendering HTML that is compliant with the latest HTML standards. This includes changes to how ASP.NET Web server controls use CSS styles.

Compatibility Setting for Rendering

By default, when a Web application or Web site targets the .NET Framework 4, the controlRenderingCompatibilityVersion attribute of the pages element is set to “4.0”. This element is defined in the machine-level Web.config file and by default applies to all ASP.NET 4 applications:

<system.web>

</system.web>

The value for controlRenderingCompatibility is a string, which allows potential new version definitions in future releases. In the current release, the following values are supported for this property:

· “3.5”. This setting indicates legacy rendering and markup. Markup rendered by controls is 100% backward compatible, and the setting of the xhtmlConformance property is honored.

· “4.0”. If the property has this setting, ASP.NET Web server controls do the following:

· The xhtmlConformance property is always treated as “Strict”. As a result, controls render XHTML 1.0 Strict markup.

· Disabling non-input controls no longer renders invalid styles.

· div elements around hidden fields are now styled so they do not interfere with user-created CSS rules.

· Menu controls render markup that is semantically correct and compliant with accessibility guidelines.

· Validation controls do not render inline styles.

· Controls that previously rendered border="0" (controls that derive from the ASP.NET Table control, and the ASP.NET Image control) no longer render this attribute.

Disabling Controls

In ASP.NET 3.5 SP1 and earlier versions, the framework renders the disabled attribute in the HTML markup for any control whose Enabled property set to false. However, according to the HTML 4.01 specification, only input elements should have this attribute.

In ASP.NET 4, you can set the controlRenderingCompatabilityVersion property to “3.5”, as in the following example:

<system.web>

</system.web>

You might create markup for a Label control like the following, which disables the control:

<asp:Label id="Label" runat="server" Text="Test" Enabled="false">

The Label control would render the following HTML:

In ASP.NET 4 Beta 2, you can set the controlRenderingCompatabilityVersion to “4.0”. In that case, only controls that render input elements will render a disabled attribute when the control’s Enabled property is set to false. Controls that do not render HTML input elements instead render a class attribute that references a CSS class that you can use to define a disabled look for the control. For example, the Label control shown in the earlier example would generate the following markup:

The default value for the class that specified for this control is “aspNetDisabled”. However, you can change this default value by setting the static DisabledCssClass static property of the WebControl class. For control developers, the behavior to use for a specific control can also be defined using the SupportsDisabledAttribute property.

Posted in: software General | Tags: rendering vsts vs 2010 visual studio css improvement compatibility disabling xhtml