CSS and the Data grid control....

[Ram]

Is it possible to control the appearence of data grid control using external
style sheets ?
If so, what should be the syntax ?
Thanks,
Ram

 

[Scott]

You can't really change the display of the DataGrid without some programming (especially if you've
done any styling of the control) and achieve the same results using CSS tags vs. styling it
yourself.

What we do is to create our own derived class from DataGrid and override the the OnItemCreated
method to attach a css classes to the various bits of the DataGrid (if you really want to do a
strict job of this, then you have to "remove" any programmer styling). It's not perfect but it works
most of the time.

In OnItemCreated, assuming that you've already assigned a css class to the DataGrid using the
CssClass property; we do something like the following:

OnItemCreated(object sender, DataGridEventArgs e)
ListItemType t = e.Item.ItemType;
DataGridItem r = e.Item.Controls[0].Parent as DataGridItem;

if (t == ListItem.Item)
r.CssClass = this.CssClass + "Itm";
else if (t == ListItem.AlternatingItm)
r.CssClass = this.CssClass + "AltItm";
// do the same for the rest of the types


In your Css file you could have something like

..DataGrid {
}

..DataGridItm {
}

..DataGridAltItm {
}

 

[Kevin Spencer]

You can't really change the display of the DataGrid without some
programming (especially if you've

done any styling of the control) and achieve the same results using CSS tags vs. styling it
yourself.

I'm afraid I have to take issue with this statement. It is certainly
possible to assign a single CSS Class to a Data Grid, and define completely
the styles that each HTML element in the DataGrid should have.

--
HTH,
Kevin Spencer
..Net Developer
Microsoft MVP
Big things are made up
of lots of little things.

You can't really change the display of the DataGrid without some

programming (especially if you've

done any styling of the control) and achieve the same results using CSS tags vs. styling it
yourself.

What we do is to create our own derived class from DataGrid and override the the OnItemCreated
method to attach a css classes to the various bits of the DataGrid (if you really want to do a
strict job of this, then you have to "remove" any programmer styling). It's not perfect but it works
most of the time.

In OnItemCreated, assuming that you've already assigned a css class to the DataGrid using the
CssClass property; we do something like the following:

OnItemCreated(object sender, DataGridEventArgs e)
ListItemType t = e.Item.ItemType;
DataGridItem r = e.Item.Controls[0].Parent as DataGridItem;

if (t == ListItem.Item)
r.CssClass = this.CssClass + "Itm";
else if (t == ListItem.AlternatingItm)
r.CssClass = this.CssClass + "AltItm";
// do the same for the rest of the types


In your Css file you could have something like

.DataGrid {
}

.DataGridItm {
}

.DataGridAltItm {
}

Is it possible to control the appearence of data grid control using external
style sheets ?
If so, what should be the syntax ?
Thanks,
Ram

 

[Scott]

Then how do you style normal items vs. alternating items? If you don't provide styles on the
control for normal vs. alternating items they both come out as normal <tr>... I believe the same is
true of the selected items in the DataGrid. You can do a lot with a single CSS but if you want the
kind of styling that the control has built-in you have to "classify" the tags of the underling
table.

Though, if you have some way to do this in a single CSS class, I love to see it.

Scott

You can't really change the display of the DataGrid without some

programming (especially if you've

done any styling of the control) and achieve the same results using CSS tags vs. styling it
yourself.

I'm afraid I have to take issue with this statement. It is certainly
possible to assign a single CSS Class to a Data Grid, and define completely
the styles that each HTML element in the DataGrid should have.

--
HTH,
Kevin Spencer
.Net Developer
Microsoft MVP
Big things are made up
of lots of little things.

You can't really change the display of the DataGrid without some

programming (especially if you've

done any styling of the control) and achieve the same results using CSS tags vs. styling it
yourself.

What we do is to create our own derived class from DataGrid and override the the OnItemCreated
method to attach a css classes to the various bits of the DataGrid (if you really want to do a
strict job of this, then you have to "remove" any programmer styling). It's not perfect but it works
most of the time.

In OnItemCreated, assuming that you've already assigned a css class to the DataGrid using the
CssClass property; we do something like the following:

OnItemCreated(object sender, DataGridEventArgs e)
ListItemType t = e.Item.ItemType;
DataGridItem r = e.Item.Controls[0].Parent as DataGridItem;

if (t == ListItem.Item)
r.CssClass = this.CssClass + "Itm";
else if (t == ListItem.AlternatingItm)
r.CssClass = this.CssClass + "AltItm";
// do the same for the rest of the types


In your Css file you could have something like

.DataGrid {
}

.DataGridItm {
}

.DataGridAltItm {
}

Is it possible to control the appearence of data grid control using external
style sheets ?
If so, what should be the syntax ?
Thanks,
Ram

 

[Kevin Spencer]

See http://www.csszengarden.com

--
HTH,
Kevin Spencer
..Net Developer
Microsoft MVP
Big things are made up
of lots of little things.

Then how do you style normal items vs. alternating items? If you don't provide styles on the
control for normal vs. alternating items they both come out as normal

true of the selected items in the DataGrid. You can do a lot with a single CSS but if you want the
kind of styling that the control has built-in you have to "classify" the tags of the underling
table.

Though, if you have some way to do this in a single CSS class, I love to see it.

Scott

You can't really change the display of the DataGrid without some

programming (especially if you've

done any styling of the control) and achieve the same results using

CSS
tags vs. styling it

yourself.

I'm afraid I have to take issue with this statement. It is certainly
possible to assign a single CSS Class to a Data Grid, and define completely
the styles that each HTML element in the DataGrid should have.

--
HTH,
Kevin Spencer
.Net Developer
Microsoft MVP
Big things are made up
of lots of little things.

You can't really change the display of the DataGrid without some

programming (especially if you've

done any styling of the control) and achieve the same results using

CSS
tags vs. styling it

yourself.

What we do is to create our own derived class from DataGrid and

override
the the OnItemCreated

method to attach a css classes to the various bits of the DataGrid (if

you
really want to do a

strict job of this, then you have to "remove" any programmer styling). It's not perfect but it works
most of the time.

In OnItemCreated, assuming that you've already assigned a css class

to
the DataGrid using the

CssClass property; we do something like the following:

OnItemCreated(object sender, DataGridEventArgs e)
ListItemType t = e.Item.ItemType;
DataGridItem r = e.Item.Controls[0].Parent as DataGridItem;

if (t == ListItem.Item)
r.CssClass = this.CssClass + "Itm";
else if (t == ListItem.AlternatingItm)
r.CssClass = this.CssClass + "AltItm";
// do the same for the rest of the types


In your Css file you could have something like

.DataGrid {
}

.DataGridItm {
}

.DataGridAltItm {
}

Is it possible to control the appearence of data grid control using external
style sheets ?
If so, what should be the syntax ?
Thanks,
Ram

 

[Scott]

Yes, well, I stand by what I said earlier -- if you want to do CSS styling of a DataGrid (with all
of the fancy stuff that the DataGrid offers as part of the control --
normal/alt/selected/header/etc.) you have to classify the table tags.

Scott

See http://www.csszengarden.com

--
HTH,
Kevin Spencer
.Net Developer
Microsoft MVP
Big things are made up
of lots of little things.

Then how do you style normal items vs. alternating items? If you don't provide styles on the
control for normal vs. alternating items they both come out as normal

true of the selected items in the DataGrid. You can do a lot with a single CSS but if you want the
kind of styling that the control has built-in you have to "classify" the tags of the underling
table.

Though, if you have some way to do this in a single CSS class, I love to see it.

Scott

You can't really change the display of the DataGrid without some
programming (especially if you've
done any styling of the control) and achieve the same results using CSS
tags vs. styling it
yourself.

I'm afraid I have to take issue with this statement. It is certainly
possible to assign a single CSS Class to a Data Grid, and define completely
the styles that each HTML element in the DataGrid should have.

--
HTH,
Kevin Spencer
.Net Developer
Microsoft MVP
Big things are made up
of lots of little things.


You can't really change the display of the DataGrid without some
programming (especially if you've
done any styling of the control) and achieve the same results using CSS
tags vs. styling it
yourself.

What we do is to create our own derived class from DataGrid and override
the the OnItemCreated
method to attach a css classes to the various bits of the DataGrid (if you
really want to do a
strict job of this, then you have to "remove" any programmer styling).
It's not perfect but it works
most of the time.

In OnItemCreated, assuming that you've already assigned a css class to
the DataGrid using the
CssClass property; we do something like the following:

OnItemCreated(object sender, DataGridEventArgs e)
ListItemType t = e.Item.ItemType;
DataGridItem r = e.Item.Controls[0].Parent as DataGridItem;

if (t == ListItem.Item)
r.CssClass = this.CssClass + "Itm";
else if (t == ListItem.AlternatingItm)
r.CssClass = this.CssClass + "AltItm";
// do the same for the rest of the types


In your Css file you could have something like

.DataGrid {
}

.DataGridItm {
}

.DataGridAltItm {
}

Is it possible to control the appearence of data grid control using
external
style sheets ?
If so, what should be the syntax ?
Thanks,
Ram