I’ve set up a Phoenix app to serve static content (currently just some images and slideshows) using html tags like this:
<img src="<%= Routes.static_path(@conn, "/images/logo.png") %>" style="width:100%">
The images (roughly square-ish in dimension) look great on mobile devices - automatically matching the width of the screen perfectly, nice and big to see, but only taking up about half the screen. 
However, when someone accesses the site on a desktop, each image becomes LARGER than the screen (because the width of a monitor is usually greater than the height), making the layout seem totally “wrong”.
My question is this: Can I set a condition somewhere to check the device type and/or screen size and adjust the width % of the images based on this info?
Thanks in advance.
