advanced web statistics

CSS Template and ASP.NET MasterPage

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!

01

02

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

Tags: CSS

ASP FileUpload Web Control and CSS

Is it possible to access the button in ASP`s FileUpload web control to change the border, text, background color, etc..?  I`ve tried using CSS and hard-coding the attributes but it only seems to show up in the textbox that is associated with the control.  The button still always looks the same.  You know, the default MS Sans Serif font.

Any suggestions?

Tags: CSS

CSS Control Adapter Toolkit Released

Yesterday Scott Guthrie announced that the CSS Control Adapter Toolkit for ASP.NET 2.0 was released.  I have been long awaiting this release so that the ASP.NET-rendered HTML output in my applications will look more organic.

For those of you that don`t know what a control adapter is it`s actually pretty neat.  A control adapter allows you to override, modify, and/or tweak the rendering output logic of that control.  With the current release of the CSS Control Adapter you will be able to render the output of the Menu, TreeView, DetailsView, FormView, and DataList.

Native ASP.NET Output

<table cellSpacing="1" cellPadding="1" width="100%" height="100%" border="0">
   <
tr>
      <
td valign="top" style="HEIGHT: 69px" bgColor="cornflowerblue">1</td>
      <
td valign="top" style="HEIGHT: 69px" bgColor="reddiebrownish">2</td>
   </
tr>
</
table>

New Output

<table class="_dataListOutput>
<
tr>
<
td class="_classA">1</td>
<
td class="_classB">2</td>
</
tr>
</
table>

Much better looking output in my opinion.  This might not be practical for most of you but I like to control the HTML and CSS output of my applications and projects whenever possible.

Tags: .NET, CSS