fix(material/sort): inconsistency of text alignment in column header

[r0m4n]

When text breaks onto multiple lines in a mat-table column header, the text-align:centerstyle
creates an inconsistency in the way the text is aligned vs other column headers. This issue
only occurs on sortable columns. It appears left aligned in all other scenarios because of how
the containers are nested.
A sample screenshot of the inconsistency:

Live example of the inconsistency:
https://stackblitz.com/edit/cdpzsf?file=src%2Fexample%2Ftable-basic-example.html

[andrewseguin]

This was merged with #30198

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}