wagtail.org
wagtail.org copied to clipboard
Markdown block display issues
The markdown block for our Blog page type isn't displaying properly with the new design. This block has been primarily used in older blogs but I have also used it recently for photo captions as well.
Here are some screenshots of the display issues from https://wagtail.org/blog/search-with-algolia/:


And here is an example of a photo caption display issue from https://wagtail.org/blog/where-were-at-for-google-summer-of-code-2022/:
We need to have a look at the styling for the Markdown block and make sure it provides consistent spacing for the blog posts that use it.
Would you mind if I tried working on this?
Go for it @DokuaAsiedu !
Go for it @DokuaAsiedu !
Alright thanks, will get right on in it
The issue stems from the negative margin that comes with .grid-align
, normally to account for child elements such as .rich-text--sf
having a big bottom margin.
One solution would be to add a ~ 120px bottom margin for .codehilite
Go for it @DokuaAsiedu !
Alright thanks, will get right on in it
@DokuaAsiedu you still working on it should i give it a go?