Variable Visions

Articles CSS Responsive-Images

tutorials - CSS and Web-Development.

Responsive Images

Published Tue. Sep. 18, 2012

Put max-width: 100%; and height: auto; on any or all img tags to make them take 100% of their parent container. Put the rule in a media query to activate only on smaller screen sizes...but watch out if you place it in a 959 or 767 media query and the parent containers are 100% wide...the images will be huge and pixelated if the quality is not there. It's more about the size of the container and that the image will fill it up.


PUBLISHED ON 01.16.24arrowInteractive 3D web sites with Spline

PUBLISHED ON 06.1.23arrowBuilding a JavaScript Metronome using Open AI Chat GPT