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

Popular posts from this blog

python - Operations inside variables -

Generic Map Parameter java -

arrays - What causes a java.lang.ArrayIndexOutOfBoundsException and how do I prevent it? -