dopplesoldner
dopplesoldner

Reputation: 9479

Javascript - table header center align

I am creating a table as follows

table = document.createElement('table');
table.style.textAlign = 'center';
table.setAttribute('border', '2');

var thead = document.createElement('thead');
thead.style.color = "fuchsia ";
thead.style.textAlign = 'center';

When I populate the table, the row content is center aligned as expected but the header row is always left aligned. What can I do to make it center aligned?

Thanks

Upvotes: 1

Views: 3363

Answers (1)

Klors
Klors

Reputation: 2674

thead is a container for th's. The th's always need to fill the thead and so the natural place to centre align things for a header row is within the th's, so...

var th = document.createElement('th');
th.style.color = "fuchsia ";
th.style.textAlign = 'center';

Oh, and also, your thead hasn't got the centre alignment set, you're setting it on the table twice.

Upvotes: 2

Related Questions