Go Premium for a chance to win a PS4. Enter to Win

x
?
Solved

Gridview skins ASP.Net

Posted on 2008-06-13
3
Medium Priority
?
7,339 Views
Last Modified: 2010-04-21
I'm trying to create a skin for a gridview.  The problem is that the grid lines are the default color, not the color they should be as specified by my style sheet.  
Here's what I have:
In Skin file
<asp:GridView runat="server" SkinId="GridViewReportSkin"
    BorderColor="#996633" BorderStyle="Solid" BorderWidth="1px">  
    <HeaderStyle CssClass="MasterGridViewHeader"/>
    <RowStyle CssClass="MasterGridViewCells"/>
</asp:GridView>

In the Style sheet
.MasterGridViewHeader
{
    border-color: #DAC9A9;
    border-style: solid;
    background-color: #DAC9A9;
}

.MasterGridViewCells
{
   border-color: #DAC9A9;
   border-width: 2px;
    border-style: solid;
    vertical-align: top;
 
}

In aspx page:

<asp:GridView ID="GridView1" runat="server" DataSourceID="ObjectDataSource1"
                    AutoGenerateColumns="False" onrowdatabound="GridView1_RowDataBound"
                    ShowFooter="True" SkinID="GridViewReportSkin">
                    <Columns>
                        <asp:BoundField DataField="OrderDate" DataFormatString="{0:MM/dd/yyyy}"
                            HeaderText="Date" />
                       ........
                   </Columns>
</asp:GridView>

If I do the following for the bound field in the aspx page it works.

<asp:BoundField DataField="OrderDate" DataFormatString="{0:MM/dd/yyyy}"
                            HeaderText="Date" >
 <ItemStyle CssClass="MasterGridViewCells"/>
</asp:BoundField>

But I dont' what to have to specify the CssClass for each bound field in the grid view.  I would like to handle it in the skin file.  Is there a way to do this?  *Note the "vertical-align: top;" does work in the skin file.

0
Comment
Question by:weimha
  • 2
3 Comments
 
LVL 21

Expert Comment

by:naspinski
ID: 21780771
try adding this:
.MasterGridViewCells tr td, .MasterGridViewHeader tr td
{
    border-color: #DAC9A9;
    border-style: solid;
    background-color: #DAC9A9;
}

Open in new window

0
 
LVL 21

Accepted Solution

by:
naspinski earned 2000 total points
ID: 21780795
nevermind that one, I forgot that they render in the TRs
.MasterGridViewCells td, .MasterGridViewHeader td
{
    border-color: #DAC9A9;
    border-style: solid;
    background-color: #DAC9A9;
}

Open in new window

0
 

Author Closing Comment

by:weimha
ID: 31466990
Worked Great.  Thanks
0

Featured Post

Free Tool: Path Explorer

An intuitive utility to help find the CSS path to UI elements on a webpage. These paths are used frequently in a variety of front-end development and QA automation tasks.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

So you have coded your own WordPress plugin and now you want to allow users to upload images to a folder in the plugin folder rather than the default media location? Follow along and this article will show you how to do just that!
Browsers only know CSS so your awesome SASS code needs to be translated into normal CSS. Here I'll try to explain what you should aim for in order to take full advantage of SASS.
In this tutorial viewers will learn how add a full-size background image to a webpage using CSS3. Create a new HTML document with an internal stylesheet.: In CSS, define the html element to have a background image. Use a high resolution image.: In t…
Learn how to create flexible layouts using relative units in CSS.  New relative units added in CSS3 include vw(viewports width), vh(viewports height), vmin(minimum of viewports height and width), and vmax (maximum of viewports height and width).
Suggested Courses

886 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question