center align in grid
div {
display: inline-grid;
grid-template-columns: repeat(3, 1fr);
grid-gap: 3px;
justify-items: center;
align-items: center;
}center align in grid
div {
display: inline-grid;
grid-template-columns: repeat(3, 1fr);
grid-gap: 3px;
justify-items: center;
align-items: center;
}ag-grid header text-align: center
const columnDefs = [
{ field: 'athlete', headerTooltip: "The athlete's name" },
{ field: 'age', headerTooltip: 'The athlete`s age' },
{ field: 'country' },
{ field: 'year', cellStyle: { 'text-align': "right" }, },
{ field: 'date', headerTooltip: 'The date of the Olympics' },
{ field: 'sport', headerTooltip: 'The sport the medal was for' },
{ field: 'gold', headerTooltip: 'How many gold medals' },
{ field: 'silver', headerTooltip: 'How many silver medals' },
{ field: 'bronze', headerTooltip: 'How many bronze medals' },
{ field: 'total', headerTooltip: 'The total number of medals' },
];
const gridOptions = {
columnDefs: columnDefs,
defaultColDef: {
width: 150,
},
tooltipShowDelay: 500,
};
// setup the grid after the page has finished loading
document.addEventListener('DOMContentLoaded', () => {
const gridDiv = document.querySelector('#myGrid');
new agGrid.Grid(gridDiv, gridOptions);
fetch('https://www.ag-grid.com/example-assets/olympic-winners.json')
.then((response) => response.json())
.then((data) => gridOptions.api.setRowData(data));
});Copyright © 2021 Codeinu
Forgot your account's password or having trouble logging into your Account? Don't worry, we'll help you to get back your account. Enter your email address and we'll send you a recovery link to reset your password. If you are experiencing problems resetting your password contact us
