CSS Template and ASP.NET MasterPage
8/17/2007 9:26:24 AM
Recently I attended a presentation by none other than Scott Guthrie on Visual Studio 2008, ASP.NET, and AJAX. It was a great presentation and in one of the demos he added a clean CSS layout that was free from Open Source Web Design. Since CSS is my least favorite thing to do I figured I would browse the site and implement an out-of-the-box solution. After taking all of 10 minutes to implement the new changes I flipped over to 'Designer View' in Visual Studio 2005 to make sure it looked correct. It did. Time to deploy the new changes and test in Internet Explorer to see if it looked correct. It didn't. Test in Firefox to see it if looked correct. It didn't. Ok.
So after scratching my head for awhile I decided to load my page again and view source. I then viewed the source of the original template (called Refresh) and started scrolling through both of them looking for a difference. The only difference I could find was the div that gets generated from the form tag.
<form name="aspnetForm" method="post" action="default.aspx" id="aspnetForm">
<div>
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwU=..." />
</div>
It has always been a habit of mine to add the form tag right after body (because it usually defaults to that location). Somehow because of this lone hero div the grey'ish (#ccc) background color was all white with a border of grey (#ccc).
Since I was using Masterpages and the only control that needed to be inside of a form was halfway down the page I decided to move the form tag. Re-deployed the site... success!


I guess this would be the presentation layer equivalent of opening your connection as late as possible...
CSS
