Removing tables in Microsoft’s ASP.Net 2.0 Controls

Microsoft has been touting ASP.Net 2.0 as taking great strides towards XHTML compatibility and meeting common accessibility guidelines. However, some controls still add table tags around them, despite your best efforts to avoid using tables. The new Login control is one of those.

For me, the table wrapper around the Login control was causing rendering problems. I was using a pure CSS layout with no tables for the login form, and the presence of the table tag wrapped around the control was breaking my layout. A quick Google search (q=asp.net+2.0+login+control+table) found a blog post that outlined a solution.

The fix was simple: create a new class, inherit from the existing System.Web.UI.WebControls.Login class, and override the Render method. A few lines of code, and the table wrapper was replaced with a div wrapper. There was one catch: the version posted on the aforementioned blog didn’t include the CssClass attribute on the new control. One extra line of code fixed that.

Below is the code, all but one line thanks to Alex Gorbatchev of dreamprojections.com:


    public class CssLogin : System.Web.UI.WebControls.Login
    {
        protected override void Render( HtmlTextWriter writer )
        {
            WebControl div = new WebControl( HtmlTextWriterTag.Div );

            LayoutTemplate.InstantiateIn( div );

            Controls.Clear();
            Controls.Add( div );

            div.CopyBaseAttributes( this );
            div.CssClass = this.CssClass;
            div.RenderControl( writer );
        }
    }

Popularity: 18% [?]

Related posts:

  1. Removing the TABLE from the CreateUserWizard control
  2. CSS Adapters for Membership Controls (working versions)
  3. Cleaning up the GridView’s EmptyDataTemplate (damn those tables!)
  4. Deleting all tables and constraints in a database
  5. Rendering content using custom server controls in ASP.Net

6 comments to Removing tables in Microsoft’s ASP.Net 2.0 Controls

  • hi,
    I am new to .net and I have a question. Where to put this? I added a new class but don’t know what else to do?

    Thanks

    -dirar

  • The techniques used in this have largely been supplanted by the CSSFriendly adapters. Go to
    http://www.asp.net/cssfriendly/ for information on this project and in-depth details, then go to http://www.sidesofmarch.com/index.php/projects/cssfriendly/ for information on the community version of these adapters, which provides some fixes, added functionality, and (arguably) simpler implementation.

  • Jeremy

    Hey, I’m still using your blog/comments on demarzo.net – and you MUST have just started redirecting it. Can you take the redirect back out, or make sure all content is rolled forward? I’m desperately trying to get table tags ripped out of the stupid login control.

    Thanks!

  • Everything that was on my old blog (demarzo.net) should be on this blog — with the same original dates, post titles, and content. The old blog is long gone (it’s been redirecting to this place for many months).

  • Jeremy

    Brian,

    Thanks for your help before. I had to let this sit on the back burner while I built up my VB.NET and ASP.NET skills. When I first came by, I was about 6 weeks into .NET programming.

    I figured out how to implement this after surfing MSDN a bit today, and used your source code as-is (translated to VB.NET).

    Just wanted to say thanks!

  • m_b

    Hi, how would you do this in VB? Cheers

Leave a Reply

 

 

 

You can use these HTML tags

<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>