CSS - Centering a footer background image -


in mvc app, have footer on each page containing image. i'd center image if possible. current css looks follows:

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

what need add center image?

you need add background-position property like:

see here

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

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 -