the text is shifting/moving down when generating PDF

[phojie]

What version of Tailwind CSS are you using?
v3

What build tool (or framework if it abstracts the build tool) are you using?
Vue 2 / Nuxt 2
JsPdf

Issue

1. The displayed text is moving down after generating the component to PDF
2. This only happens after I added tailwindcss. I tried some several css frameworks, It all work so well.

Without Tailwind

-ba8d-39785638e2e9.png">

With Tailwind

[Bobybyk]

Same problem here, i don't understand why...

[L9m]

disabled taliwind preflight work for me

corePlugins: {
    boxSizing: 'border-box',
    preflight: false,
  },

[smithliam]

Provide something to test in the playground https://play.tailwindcss.com/ after replicating the same problem in the playground, simply copy the link via the Share button and paste it here.

[JakeBelanger]

Did you ever figure it out?

[alts9]

Apparently, this is caused by Tailwind Preflight (similar to reset CSS). I managed to undo the effect by inserting this into my CSS:
img, svg, video, canvas, audio, iframe, embed, object { display: initial; vertical-align: initial; }

In preflight stylesheet, the value changed to 'display: block; vertical-align: middle; so override this setting might affect Tailwind's behavior

Read Tailwind docs about Preflight for more info

[jp1304-brikl]

This works like a charm! Thanks a lot!