node.js - CSS images not displaying with AngularJS on Heroku -
i using heroku - yeoman - angularjs full-stack - bootstrap - nodejs stack.
deployment on heroku built using 'grunt build' command. when deployed heroku having problems rendering css images on web pages. images within page displayed not css files.
eg: code below not work
css
.aboutpage-header { height: 250px; background: url('../images/slider-map.jpg') center center no-repeat scroll; -webkit-background-size: cover; -moz-background-size: cover; background-size: cover; -o-background-size: cover; padding-top: 50px; }
html:
<header class="aboutpage-header"> <div class="container text-center"> <div class="row"> <div class="col-lg-12"> <h2 class="title">about us</h2> <h2 class="intro"><i class="fa fa-location-arrow"></i>company<span class="highlight">it</span> experts in bespoke software development , tailored consulting</h2> </div> </div> </div> </header>
locally works fine when running grunt serve
it's deployed on heroku css images missing.
as suggested in comments, link should be:
/assets/images/image.jpg
instead of:
../assets/images/image.jpg
Comments
Post a Comment