I was working on a site tonight after being away from it for over three months. I came across some CSS and it took me a while to remember what it was for. I gleaned this online somewhere ages ago, but kudos and credit to the author whoever they are!

Jumping Treeview

 

For some time I have been having problems using the ASP.NET TreeView control in Sitemaps; every time I would hover over one of the parent nodes it would jump up and down. Here's some sample markup and the CSS to fix it in Firefox:

        <div id="idTreeView">
            <asp:TreeView ID="TreeView1" runat="server"                     DataSourceID="SiteMapDataSource1"
                    HoverNodeStyle-Height="0" Font-Bold="true" ImageSet="BulletedList">
                <RootNodeStyle Font-Bold="True" />
                <ParentNodeStyle VerticalPadding="0px" Font-Bold="True"                     Font-Underline="false"  />
                <HoverNodeStyle Font-Underline="false" ForeColor="#5555DD" />
                <NodeStyle Font-Bold="False" Font-Size="8pt" CssClass="sitelink"
                    ForeColor="Black" HorizontalPadding="5px" NodeSpacing="0px"                     VerticalPadding="0px" />
            </asp:TreeView>
           
            <asp:SiteMapDataSource ID="SiteMapDataSource1" runat="server" />
        </div>

 

        div#idTreeView img
        {
            display: block;
            float: left;
        }

        div#idTreeView div
        {
            display: inline-block;
        }

        div#idTreeView .sitelink a
        {
            text-decoration:none;
        }

 

kick it on DotNetKicks.com

Tags: ,

ASP.NET | CSS




There are times when you will want to set the color of the grid lines in your GridView - however there is not to my knowledge a way of doing this declaratively. A workaround is to do this by tapping into the GridView's RowDataBound event.

GridView Gridlines

 

First, set the OnRowDataBound property in the markup of the GridView:

OnRowDataBound="MyGrid_RowDataBound"

 

Second, set the color in the OnRowDataBound handler method:

protected void MyGrid_RowDataBound(object sender, GridViewRowEventArgs e)
{
     foreach (TableCell tc in e.Row.Cells)
     {
         tc.Attributes["style"] = "border-color: #c3cecc";
     }
}

 

Happy coding :-)

Update 06-01-2009:
See Lee's suggestion in the comments on a quicker way to do this:
Add this to the page Load method: this.GridView1.Attributes.Add("bordercolor", "c3cecc");

kick it on DotNetKicks.com  411ASP.NET




I really like the developer toolbar in IE8 although I'm still getting familiar with it. I am in the process of putting the finishing touches to a new site for a client and was validating the CSS and the XHTML. The CSS passed on the first try, but the markup took a while. Initially it barked because of an ampersand in the footer credits, but changing this to the corresponding "&#38;" special character entity number did the trick.

IE8 Developer Toolbar

 

Then I got the following error: "No Character encoding declared at document level..." I am using XHTML 1.0 Transitional:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

 

After much ado, the solution was to add the following to the head section in the master page:

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

 

Up to now I have been using the Firefox developer toolbar and I would be lost without it, especially when working with CSS. The "CSS -> View Style Information" menu option has to be the best thing since sliced bread. Top of my to-do list this summer is to improve my JavaScript skills. I anticipate that the exercise will bring me into closer contact with Firebug which has a great reputation as a Javascript debugging tool. It will be interesting for me personally as a JavaScript novice to do a side-by-side comparison of the development/debugging experience with Firebug and the new JavaScript-friendly VS 2008. Has anyone got any takes on this?

Resources

* VS 2008 JavaScript Debugging

* VS 2008 JavaScript Intellisense

kick it on DotNetKicks.com