CSS image resize horizontally -
div.image { background-image: url('http://www.seedsavers.org/site/img/seo%20images/0841-benarys-giant-zinnia-flower.jpg'); background-position: center; background-repeat: no-repeat; width: 500px; height: 500px; }
i use above css code diplay 500x500 image
. shows on screen however, there way when resize window vertically
image not resize
@ (scrollbars appear) when resize window horizontally
resize
new width fit screen? thanks
dont specify width , height in px insted use %
div.image { background-image: url('http://www.seedsavers.org/site/img/seo%20images/0841-benarys-giant-zinnia-flower.jpg'); background-position: center; background-repeat: no-repeat; width: 50%; height: 50%; /* both want */ }
or else use media query.
Comments
Post a Comment