CODEWITHSUNDEEP
imagebackgroundhovercss
Meltdown87
Meltdown87

Reputation: 33

CSS hover image max-width: 100% not working

I've got two big css image hovers... and I want the images to be max-width:100% (for phones). I can make the divs max-width 100% but then the image inside them just logically gets cut off by the div edge. How can I make sure that the image (in this case a background-image) in the div also does the 100% max-width?

Demo: http://www.buzz-creative.nl/_test/index.html

Thanks in advance!

Upvotes: 0

Views: 1610

Answers (2)

Andy
Andy

Reputation: 14575

http://jsfiddle.net/ZuX4p/

This uses background-size: 100% to make the background image fill the div, the only problem with this is you have to specify height and width, as there is no content in the div so it wants to be 0px by 0px

Upvotes: 1

abhinav pratap
abhinav pratap

Reputation: 623

try, background-size:auto;

link http://www.css3.info/preview/background-size/

Upvotes: 0

Related Questions