
Wednesday, April 20, 2005
I have completed the migration of CHT to use a 3 column dynamic layout
using DIV's. I haven't found many examples of this especially
with ASP.NET. I will eventually expand this into a full tutorial.
Advantages of DIVs vs TABLEs
You can find this someplace else but I want to emphasize the reason i
switched to div's was for troubleshooting and ease of maintenance not
standards compliance (but that's another upside). I find that I
can read through my HTML much more quickly and the div actually
provides a semantic meaning to the content versus a bunch of nested
garbled tables.
Traps
The hardest part was making this dynamic. For instance what
happens when you only want a two column layout or a one column
layout?
Implementation
The key is using a panel control (actually 3 of them or more).
The ASP.NET panel control is actually rendered as a div (in most
browsers, you may have to use the browser caps hack to get the correct
rendering in all browsers but this is pretty easy). Once you are
working with divs then the normal CSS rules apply. The secret is
applying styles dynamically so that the divs can be resized based on
whether they contain content or not. This is actually straight
forward.
I promise I will post the sample code soon.