CSS - Footer image not resizing correctly when browser viewport changes -


i have mvc app image in footer. css looks follows:

footer {     position:absolute;     bottom:-150px; /* puts footer 100px below bottom of page*/     width:70%;     height: 170px;   /* height of footer */     background-image: url("/images/footer/footer3.png");     background-repeat: no-repeat;     background-position: center; } 

the problem have image not being resized correctly fit within width , height of container. parts of image cut off. , when resize browser viewport (shrink it), more of image cut off. image size 1000x175 if helps. image responsive , auto resized correctly within container.

did try

  background-size: 100% 100%; 

Comments

Popular posts from this blog

javascript - Slick Slider width recalculation -

jsf - PrimeFaces Datatable - What is f:facet actually doing? -

angular2 services - Angular 2 RC 4 Http post not firing -