Hi,
Can we change the background color of datatable header rows. I tried using background-color property but in vain.
Data Table : changing background color of header row
Try with more specific css selectors like;
Code: Select all
<p:dataTable styleClass="myTable" ... />
.ui-datatable.myTable th {
background: red;
}
PrimeFaces Team Member
-
- Prime
- Posts: 18616
- Joined: 05 Jan 2009, 00:21
- Location: Cybertron
- Contact:
Check your css, your theme can overwrite with a background image.
I am having the same issue. I can not figure out how to change the background color of the headers or footers of a data table. Spplying the a style only chnges the color of a data cell, not a header cell.
I have also not been able to figure out how to apply a different theme for PrimiNG to use either.
The docs say:
but does not say where to put this code. I am using the DataTable in a MVC.Net application running Angular2 on the frontEnd, inside an angular2 component template.
Code: Select all
<p-dataTable [value]="_countriesHC"
[rows]="5" [paginator]="true" [pageLinks]="3"
[responsive]="true" [stacked]="stacked">
<p-column field="DisplayName" header="Country Name" sortable="true" style="background-color:rgba(255, 0, 0, 0.51);"></p-column>
<p-column field="CountryId" header="Country Guid" style="background-color:rgba(0, 0, 255, 0.51);"></p-column>
<p-column field="Abbreviation" header="Country Abbreviation" sortable="true" style="background-color:rgba(0, 128, 0, 0.53);"></p-column>
<footer>
<div class="ui-helper-clearfix" style="width:100%">
<button pButton type="button" icon="fa-plus" iconPos="left" label="Add" style="float:left;" (click)="hello()"></button>
</div>
</footer>
</p-dataTable>
I have also not been able to figure out how to apply a different theme for PrimiNG to use either.
The docs say:
Code: Select all
<context-param>
<param-name>primefaces.THEME</param-name>
<param-value>bootstrap</param-value>
</context-param>
leventgny wrote:Try with more specific css selectors like;
Code: Select all
<p:dataTable styleClass="myTable" ... /> .ui-datatable.myTable th { background: red; }
Since it is apparent you are using some attribute names other than the standard CSS attributes, such as "background" instead of "background-color", where are all these redefined CSS attributes defined?
-
- Posts: 5281
- Joined: 29 Jun 2013, 12:38
Hi Paulg,
For PrimeNg, please see this issues;
https://github.com/primefaces/primeng/issues/321
https://github.com/primefaces/primeng/issues/329
For PrimeNg, please see this issues;
https://github.com/primefaces/primeng/issues/321
https://github.com/primefaces/primeng/issues/329
Github Profile: https://github.com/mertsincan
-
- Information
-
Who is online
Users browsing this forum: No registered users and 43 guests