Support

Account

Home Forums General Issues How to use the image field for backgrounds? Reply To: How to use the image field for backgrounds?

  • Hi, I had the same issue, in which @skd’s last comment solved, however I’m struggling to move that style to my css file. Is it possible to move it here, since I want to further style the background image with a black gradient, to help text legibility.

    section {
        background: linear-gradient(
            rgba(20,20,20, .5),
            rgba(20,20,20, .5)),
            url("<?php the_field('hero_image'); ?>"),
            no-repeat 0% 80%;
            -webkit-background-size: cover;
            -moz-background-size: cover;
            -o-background-size: cover;
            background-size: cover;
    }

    I’ve also tried having it as the solo background:
    background-image: url(<?php the_field('hero_image'); ?>);