8

I have a pandas DataFrame and am using the DataFrame.to_html method to generate a table I can send within an HTML email message. I simply want the values in certain columns to be centered, but would also like to know in general how to apply formatting to the table. I have tried applying the documentation found HERE as well as using df.style before using to_html like so:

df.style.set_properties(**{'text-align':'center'})

But i am still getting all of my values left-aligned (other than the headers, which are centered).

What is the correct way to center all (or a subset) of my column values, and what are the other options available for formatting? (e.g. bolding text, changing background or border colors, etc.)

Further, at what stage should this formatting be applied? Within the to_html method or prior to it as I tried with df.style?

Improve this question

5 Answers 5

Reset to default
12

I would suggest using the formatters within the to_html function, description of the parameter:

formatters : list or dict of one-parameter functions, optional formatter functions to apply to columns’ elements by position or name, default None. The result of each function must be a unicode string. List must be of length equal to the number of columns.

Example if you want to make all your Name column bold:

df.to_html(formatters={'Name': lambda x: '<b>' + x + '</b>'})

Let me know whether it works!

Improve this answer
Sign up to request clarification or add additional context in comments.

10 Comments

This makes sense to me. Can you include an example where you use formatters to center all cell values (all columns)?
@RichardGolz If it's only for the purpose of centering the cells, I would probably just modify the string you get after using df.to_html by adding align='center' within the <table> tag so it becomes <table align='center'>, that to me is more straight forward than centering each column.
something like html[:6] + ' align="center"' + html[6:]
I now have <table align="center" border="1" class="dataframe"> but it still appears to be left-aligned. Sigh. Below that I do see <thead> <tr style="text-align: right;"> - wonder if that has anything to do with it (although my data is appearing left aligned)
You forget to add escape=False, otherwise the HTML tag will get escaped. (< becomes &lt;)
|
8

After some research and the help of Bubble Bubble Bubble Gut, this can be easily done by replacing all of the <tr> tags with <tr align="center"> via:

html2 = html.replace('<tr>', '<tr align="center">')
print(html2)
Improve this answer

1 Comment

Or like this with CSS for example for both TD and TH tags html = str(df_group[:5].to_html()).replace('<td>', '<td style="text-align: left">').replace('<th>', '<th style="text-align: left">')
6

I solved this problem with make a little change in CSS and python code. Here's my python code :

dft.to_html(classes=["table-bordered", "table-striped", "table-hover", "isi"]

I make "isi" class and write it in CSS like this :

.isi {
text-align:center; }

Here's the result Values Centered

Improve this answer

1 Comment

For those not familiar with CSS, the code should be complete. The code sample gives 'invalid syntax' error on the definition of "isi"
1

if you want the entire table to be centred just use the justify parameter:

 df.to_html(justify="center")
Improve this answer

2 Comments

The justify= parameter justifies column labels (see docs).
This solution worked for me with **justify="left"**. Simple and Easy. Thanks.
0

I suggest to use the Styler object instead of the to_html() parameters. This way you can separate the styling from the rendering.

# create test dataframe
df = pd.DataFrame({"what": ["a", "b", "c", "d"], "howmuch": [55, 60, 101, 78]})

# create a Styler
df_styled = df.style.set_properties(
    **{"text-align": "center", "font-weight": "bold"}
).hide(axis="index")

# export html with style
df_styled.to_html("myFile.html")
Improve this answer

2 Comments

how can you align the entire dataframe table container on an html page?
@pdangelo4 check out the pandas.io.formats.style.Styler class. There is certianly a way to add custom CSS.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.