Floating images in Ghost
There is no built-in method inĀ GhostĀ for floating an image and having text flow around it. Itās a significant omission, and one which they say is ātoo hardā and have no plans to change. OK fine, Iāll do it myself. I found a reasonable solution inĀ this postĀ on the forums. Hereās how Iām using it. Add the following to the header in the code injection area: /* small images to float but not look stupid on mobile */ @media (min-width: 40rem) { .float-left-half figure, .float-left-two-thirds figure { float: left; margin: 8px 20px 6px 0; } .float-right-half figure, .float-right-two-thirds figure { float: right; margin: 8px 0 6px 20px; } .float-left-half figure, .float-right-half figure { max-width: 50%; } @media (min-width: 64em) { .float-left-two-thirds figure, .float-right-two-thirds figure { max-width: 67%; } } } Then, in a post or page, I add an HTML block before the image card I want to float (e.g to the right). ...