Forums

Give help. Get help.

  • # February 10, 2018 at 12:22 pm

    I’ll start with the text. here is my code.

    body > article h1 {
    color: rgb(211, 211, 211);
    text-shadow: 0px 0px 5px black;
    }

    I’m trying to get both the color and the shadow to apply to the first h1 which is located in the article. When I only use h1{} it applies just the shadow to the first h1 and both to all the others.

    as for the drop shadow here is my code.

    #mportrait {
    filter: drop-shadow(-15px 0px 5px rgba(51, 51, 51, 0.9));
    transform: scaleX(-1);
    filter: grayscale(0.7);
    opacity: 0.6;
    }

    Everything but the drop shadow has taken effect on the image.

    # February 10, 2018 at 12:28 pm
    body > article h1 
    
    

    This won’t work because the article is not an immediate descendant of the body (>)…remove that and it works.

    # February 10, 2018 at 12:32 pm

    As for this

    #mportrait { 
        filter: drop-shadow(-15px 0px 5px rgba(51, 51, 51, 0.9));
        transform: scaleX(-1);
        filter: grayscale(0.7);
        opacity: 0.6;
    }
    

    The second filter is overriding the first…you’ll need to apply them as a single combined property..but remember that order is important…but perhaps not in this case.

    #mportrait { 
        filter: grayscale(0.7) drop-shadow(-15px 0px 5px rgba(51, 51, 51, 0.9)) ;
        transform: scaleX(-1);
        opacity: 0.6;
    }
    

    https://developer.mozilla.org/en-US/docs/Web/CSS/filter

Viewing 3 posts - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.

icon-anchoricon-closeicon-emailicon-linkicon-logo-staricon-menuicon-nav-guideicon-searchicon-staricon-tag