danurbanowicz / eleventy-netlify-boilerplate

A template for building a blog with the Eleventy static site generator and Decap CMS

Home Page:https://eleventy-netlify-boilerplate.netlify.app/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Images and text are not fully responsive/cut off on mobile

zachco opened this issue · comments

Not sure if its a CSS issue or you'd need to use something like the Eleventy image responsiver plugin, but it would be nice for the text and images to be fully responsive and not cut off on mobile and browser resize.

Taken on my computer (not zoomed):
Screen Shot 2020-06-23 at 1 21 50 PM

Taken on my phone (not zoomed):

Thank you!

Basic responsive image support was missing from the stylesheet for some reason 😲 and has now been added with commit b1083a2

These two lines of CSS will ensure that images do not grow outside of their parent container.

img {
  max-width: 100%;
  height: auto;
}

Anything more snazzy than that is probably outside the scope of this template, although the plugins you mentioned look quite interesting.