sideways text in table header

Previous Topic Next Topic
 
classic Classic list List threaded Threaded
6 messages Options
Reply | Threaded
Open this post in threaded view
|

sideways text in table header

be.wood
I am wondering if there is a way to orient the text in a table header to be sideways. I think this may be able to be done in HTML using custom CSS, but it isn't clear to me that this could be done in a PDF using this method and I'm not sure about the YML theme for it.

Basically I have some tables that currently use text in the header that is rotated counter-clockwise 90' (so you would read it from the right side of the page as the bottom) as there needs to be a lot of columns but they are just full of check marks (or X).

Is there some method of using external styles that can be used to achieve this?

Thank you

Brian Wood
Reply | Threaded
Open this post in threaded view
|

Re: sideways text in table header

mojavelinux
Administrator
Brian,

I had looked into this once. I found that although Prawn Table does support rotating text in a cell, it does not compute the height of the cell correctly in this scenario. As a result, the text spills outside of the cell. Until that is fixed, there's no point adding this feature in Asciidoctor PDF.


You might consider exploring asciidoctor-pdf.js as an alternative, which puts the power of CSS when generating PDF back into your hands. See https://github.com/mogztter/asciidoctor-pdf.js (Note that library is still in the experimental phase).

Best,

-Dan

On Thu, Sep 26, 2019 at 2:44 AM be.wood [via Asciidoctor :: Discussion] <[hidden email]> wrote:
I am wondering if there is a way to orient the text in a table header to be sideways. I think this may be able to be done in HTML using custom CSS, but it isn't clear to me that this could be done in a PDF using this method and I'm not sure about the YML theme for it.

Basically I have some tables that currently use text in the header that is rotated counter-clockwise 90' (so you would read it from the right side of the page as the bottom) as there needs to be a lot of columns but they are just full of check marks (or X).

Is there some method of using external styles that can be used to achieve this?

Thank you

Brian Wood


If you reply to this email, your message will be added to the discussion below:
https://discuss.asciidoctor.org/sideways-text-in-table-header-tp7163.html
To start a new topic under Asciidoctor :: Discussion, email [hidden email]
To unsubscribe from Asciidoctor :: Discussion, click here.
NAML


--
Dan Allen | @mojavelinux | https://twitter.com/mojavelinux
Reply | Threaded
Open this post in threaded view
|

Re: sideways text in table header

be.wood
As a follow-on question to this, I need to create separate table styles in the document. I don't want all the tables to have rotated text in the header, just some of them. I know this can be done in CSS, but what I don't know is how to associate the style I need in the Asciidoctor file itself.

So for example, I want the first table with normal headers, but then a second table with the rotated headers. These would probably be the only styles I would use for the tables, but I'm not sure how to mark one table to use one style class over another.
Reply | Threaded
Open this post in threaded view
|

Re: sideways text in table header

mojavelinux
Administrator
In Asciidoctor, when you add a role to a block, that translates into a CSS class in the HTML output. So you can style different tables differently by assigning roles and using CSS as you normally would.


Best,

-Dan

On Wed, Nov 27, 2019 at 8:48 AM be.wood [via Asciidoctor :: Discussion] <[hidden email]> wrote:
As a follow-on question to this, I need to create separate table styles in the document. I don't want all the tables to have rotated text in the header, just some of them. I know this can be done in CSS, but what I don't know is how to associate the style I need in the Asciidoctor file itself.

So for example, I want the first table with normal headers, but then a second table with the rotated headers. These would probably be the only styles I would use for the tables, but I'm not sure how to mark one table to use one style class over another.


If you reply to this email, your message will be added to the discussion below:
https://discuss.asciidoctor.org/sideways-text-in-table-header-tp7163p7374.html
To start a new topic under Asciidoctor :: Discussion, email [hidden email]
To unsubscribe from Asciidoctor :: Discussion, click here.
NAML


--
Dan Allen | @mojavelinux | https://twitter.com/mojavelinux
Reply | Threaded
Open this post in threaded view
|

Re: sideways text in table header

be.wood
Thank you. Now I just need to figure out my CSS and I'll be good, but this looks good.


Reply | Threaded
Open this post in threaded view
|

Re: sideways text in table header

harrylee
Hi Brian,

Did you manage to solve this?

I have a similar issue, I can add the CSS styles to do the rotation. However, I need to add a new class to the \<th\> tag, I can't seem to find a way to do this.

Any guidance is appreciated.

Thanks,
Harry