Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Decreasing font size for tables #239

Open
sbonaretti opened this issue Jul 1, 2019 · 4 comments
Open

Decreasing font size for tables #239

sbonaretti opened this issue Jul 1, 2019 · 4 comments
Labels
frontend issues related to the HTML view and interactivity

Comments

@sbonaretti
Copy link

Hi guys! Is there a way to customize tables? Like a .css where I can decrease font size? I would like to do this for 2 reasons:

  • I would like to show the .html during a presentation, and my table is too wide. Scrolling sideways would not show the first left column, where I have my variable names
  • I would like to submit the .pdf to bioRxiv once done, and tables should be fully visible.
    Hope this is an easy fix! Thanks! :)
@vincerubinetti
Copy link
Collaborator

Yes, the .css is (probably confusingly) in the file build/themes/default.html.

The styling classes for tables are on these lines for normal and on these lines for printing (pdf export or ctrl + p in browser).

It seems like you already know CSS, but for anyone else looking at this answer, you can add one of the following lines to change the font size:

font-size: 12px; /* set size in terms of pixels (character height) */
font-size: 10pt; /* set size in terms of points */
font-size: 0.75em; /* set size relative to main document font-size */

See:
https://kyleschaeffer.com/css-font-size-em-vs-px-vs-pt-vs-percent

@dhimmel
Copy link
Member

dhimmel commented Jul 1, 2019

@sbonaretti would you like to change the font size of all tables or just specific ones? There should also be a way to select specific tables for smaller font size, but it is a bit challenging due to jgm/pandoc#684 (comment).

@sbonaretti
Copy link
Author

I changed the font size of all tables, and this works pretty well, both for the .html and .pdf. Thanks!

@dhimmel dhimmel changed the title customizing tables Decreasing font size for tables Jul 3, 2019
@sbonaretti
Copy link
Author

In case it's useful, I have also added to the table sections of build/themes/default.html some lines to warp URLs in one cell (to avoid that they "invade" the next cell):

table td {
    word-wrap: break-word;        
    overflow-wrap: break-word;   
}

@dhimmel dhimmel added the frontend issues related to the HTML view and interactivity label Mar 5, 2020
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
frontend issues related to the HTML view and interactivity
Projects
None yet
Development

No branches or pull requests

3 participants