CSS Takeaway | Why setting max-width:100% on all images from the off can be a bad idea.

It may be tempting to apply a blanket max-width:100% style declaration to all images when building a responsive site. Here's one reason why it might not always be a good idea.

An image within a floated, width-defined parent div

An image within a floated, width-undefined parent div

Check in IE8, it seems the image above disappears.

So (in IE8) if you set max-width: 100% on all images and an image happens to have a floated parent that doesn't have a specified width, the max-width is interpreted as 0 because the parent is collapsed.