💾 Wide images

Wed, 20 Dec 2023 17:07:50 +0000

Thanks to the help from the amazing Benjamin Hollon, this blog now has wide images. The CSS only applies to the post's first image, but it can be easily changed to apply to all the images in a post.

The CSS is below:

#post-body .e-content img {
    min-width: 100%;
    margin-left: 0px;
    position: relative;
    display: inline-box;
}

@media (min-width: 1050px) {
    #post-body .e-content > :first-child img {
        min-width: 160%;
        margin-left: -30%;
        position: relative;
        display: inline-box;
    }
}

Don't forget to check Benjamin's CSS framework, readable.css.

#CSS #Writefreely #Blog

css — Bruno's ramblings

💾 Wide images