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

Too much space between image and figcaption in base prose class #257

Closed
MichaelAllenWarner opened this issue Mar 18, 2022 · 1 comment · Fixed by #267
Closed

Too much space between image and figcaption in base prose class #257

MichaelAllenWarner opened this issue Mar 18, 2022 · 1 comment · Fixed by #267

Comments

@MichaelAllenWarner
Copy link

MichaelAllenWarner commented Mar 18, 2022

What version of @tailwindcss/typography are you using?

v0.5.2

What version of Node.js are you using?

v16.4.2

What browser are you using?

Chrome

What operating system are you using?

macOS

Reproduction repository

https://play.tailwindcss.com/uj1vGACRJA

Describe your issue

NB: I used the official Typography demo URL as the "Reproduction repository," and the screenshots below are taken from that demo.

In the base .prose, there's a lot of space between image and figcaption in a figure:

Screen Shot 2022-03-18 at 11 50 37 AM

I believe this is not intended, as with .prose-lg it looks like this:

Screen Shot 2022-03-18 at 11 51 57 AM

I think there's a zero-vertical-margin rule on the image that's losing the specificity battle in .prose but winning it in .prose-lg.

@JeanLucEsser
Copy link

Somehow related to the same spacing issue, I'm adding this here, while we're at it.

When using the picture tag inside figure, which should be common practice, prose does not apply its classes to figure, img and figcaption.

  <figure>
    <picture>
      <source
        type="image/webp"
        sizes="100vw"
        srcset="..."
      />
      <img
        src="..."
        srcset="..."
        sizes="100vw"
      />
      <figcaption>...</figcaption>
    </picture>
  </figure>

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants