My images won't resize….I need your help!!!

[Ceddyp]

I can’t seem to get my images to resize or become responsive. I included a reset in there, maybe that has something to do with it?

http://codepen.io/Ceddman/pen/wGOjvr

[Senff]

Where’s your images? I only see the “Detroit Free Press” logo.

Also, there are no media queries anywhere in your code, so that would explain why nothing is responsive.

[Ceddyp]

The other text “new e-newspaper guide” is an image. I cant use the web font so this was an easy quick fix.

Shouldn’t the images shrink if I resize the browser window if I have the Height: 100%; width:auto; rule applied anyway, No matter if I even have media queries in the CSS?

[Senff]

You’ve set max-width: 100%; for each image. This means that it will never be larger than 100% of it’s parent, and does not have a reference to the window size.

The parent of the parent of the images (“#topbarinner”) is hard-coded at 960 pixels, so that block will never resize with the window width, and so the images will never be larger than 960 pixels…but of course that doesn’t help much when your screen is smaller.

If you give #topbarinner a width of 100%, you’ll be going in the right direction.

[Author]

Posts