In SharePoint (MOSS) 2007 there are many ActiveX controls which add useful functionality like date picking, editing list items in an Excel-like datasheet, uploading of multiple items, and others.

The Problem

You may run into problems though if you have a dark CSS background color for your site which is defined on the <body> element. The ActiveX control will show this dark color as its background color even if it is a child of another element with a light background color. This makes it difficult , if not impossible, to read and work with the content in the control.

The Fix

If your design calls for a dark background color the only way to make the content in the ActiveX items readable is to change the color on the <body> element to a light color. That means you need another element to apply your dark color to that is unique enough for targeting with CSS and wraps the entire contents of the page.

If you look through the source code you’ll notice that there is always a form tag (common with .NET) with the id=”aspnetForm” just inside the body. This can serve as the element to apply our “real” background color to.

Here is what the CSS would look like:

          body {
    /* Background color for ActiveX items like "Edit in Datasheet */
    background-color: white;
}

form#aspnetForm {
    /* real background color for the site as a whole */
    background-color: #002842;

    /* to be sure it fills the whole page vertically */
    height: 100%;
}

There you have it, a white background for the datasheet views and other ActiveX controls but still a dark blue background for the site as a whole.