You are my life saver, just watched your 40 minute tutorial of html a fortnight ago, and now i'm OBSESSED!! with web design.

One More Way! : change value in both * div{ background: linear-gradient( rgba(0,0,0,0.6), rgba(0,0,0,0.6) ) *,* url('background.jpg'); }

This video was the very first time I got it right to make a semi transparent background, been looking for a way since 2 moths ago, very simplistic explanation, thanks a ton!!

You can also decrease the brightness of the image. ex: filter: brightness(%);

Your videos are so cool and relaxing. Your setup feels warm and your approach to teaching is really calm. I always tend to at least open any of your videos and leave a like even if I don't plan on watching it at that time. Plan on consuming more of your content this year. Keep up the great work

next-level editing :o

I just spent a couple of hours watching long videos that showed this technique but didn't explained the why's... you did it in under 3 minutes. You have a new subscriber.

😱I am gonna save this to my playlist to save hours of time searching over a bunch of StackOverflow issues. Thank you so much!

That 'zombie' entrance was pretty impressive.

Love that skit at the beginning!

That's a lot of code for such a simple task. Lower level developers have some work to do. Anyway it worked for me lol, thank you!

THANK YOU JESS, THE POSITION RELATIVE TO THE TEXT SAVED MY LIFE!!!!!!!!!!!!

I was just struggling with this tonight and then found this video. Thanks!

Thank you. I struggled with this until now.

Very short, straight forward & informative...she understood Dom elements very well

one of the favorite channel for me. keep going. good luck!!

Truth be told, most men think women don't understand without coding, but you go beyond this judgment. And this is very good for feminist people like me.

You are a savior! I couldn't find any solution to this problem by googling it. Finally, I tried KZfaq and found this video! Many thanks!

I've been looking for this for 2 days. ty so much ^^

one of the most expressive tutor that makes me easy to understand the message 😂🤣👍

This is an underrated channel...

This was really well produced! Also, been thinking of getting that Logitech keyboard.

This tutorial helped me out so much! Thank you so much for this! Also, are you planning to upload more frontendmentor live coding vids?? Those are really helpful too and I learn so much from them! :D

You really nailed it: quick and precise! That's a rare thing!

Hi @coder coder Thank you for the tutorial! Think that it has the clearest instructions and explanation among all the tutorial out there. Would like to check which HTML element you are referring to with the ".hero" class name. Separately, I would also like to check why you add a "&" to the ::before pseudo element.

First time heard about this option, helped me to solve problem in my project, thanks so much for this video

Finally someone explained this to me. 😌

I didn't understand anything lol

Thank you, this is what I was looking for

Wow I faced the same problem yesterday and today this got recommended 😍😍

You are very helpful, you keep it simple and you explained it very well. I have been having trouble for the last few days with text being stuck underneath the background (I managed to change the opacity through pseudo-class, though). Now I know I had to put position of the text to "relative" to bring it front. z-index didn't work. So, big thanks from beginner girl coder :)

i had been struggling on this for ages

Your editor looks awesome

It's a neat trick. Loved it.

So much thanks for this; it works responsively too if I have to scroll the page down the overlay also exists on the scrolled pages thank you!!

Explained very well in less than 3 minutes. Thank you😁

Having watched a lot of Kevin Powell tutorials before learning about Coder Coder, my first thought when she said separate the background-image to the text is "pseudoelements" 😂 I guess, I AM learning from these tutorials

I saved this video to my "CSS videos" ::after I watched it.

Damn I couldn't think of adding the image actually to the pseudo element when I was trying. Sometimes basic video like this helps. Thanks

Great tutorial Jessica, that's how I do it too!

Ot great privilege to see you coding by non programming and non coder I wish i could have chosen right path

I started from learning and loving CSS to learning and hating it

awesome content, girl! keep going for us

Nice and short explanation, Thanks

This my today problem and finaly I catch up this video :) Thank you

I am no web developer...but i opened the video to hear your voice...an alternative for headspace app's monk voice

holy High quality tutorial batman

Very cool!! TKS for this tutorial!!

Amazing! thank you for the straight forward explaination!

It worked, cool! Thank you cause I was strugling a lot..

I realy love your tutorials.. Please make some tutorials on java programming

Very helpful thanks!

u're a genius 🔥🔥🔥

A very good teacher, high quality but low view counts, why? The reason maybe the contents is: these knowledges are very important, but also very basic & simple, I think too many of audiences already knows these basic web knowledges.

you latterly saved me. Thank you so much

You just saved my career 😂😂 tnxx very much.

Amazing! Thanks

Really like your presentation style ✌️

Extremely well made video.

I needed this video thanku

Hey I really like the quality of your videos! do you edit your own videos or do you hire someone to edit for you?

This worked for me with after I removed the display: flex. Thanks.

nice video but try puttingthis: background: rgba(0,0,0,.5) url('yourImage.jpg); background-blend-mode: multiply; to make the effect you want,

good session abnux! GG

Awesome!!!! Thanks for the tips:-D

Thank you for this, it was helpful.

Nice animations and helpful tips as always 😄

What A nice Tuto Thanks 👍 ;)

This was awesome

thank god, Now i have a woman code teacher in yt, great tutorial! love the editing♥😁

excellent you explained well and it was easy to understand.

Thanks for this article 🤩🤩

She's fucking brilliant! Wasted 2 hours to find this trick! Thanks a loooooot!

I loved, you saved me 😍😍

omg i was having an opacity calamity until this video!!!!1!

What a good video, greetings from Mexico

Love you!

Thanks for freeing me from my misery! I was struggling with my code -___- Why haven't they thought of this problem already?!

its knowledge is useful thankx

ty great video

Next level facial expression

@codewithharry ne Ye sab ek saath aasan tareeke se smjha rkha h

hello Jessica Chan, you have a great quality display of video content on your channel! This is a very recommendation for learning programming, especially for me, btw what video editor do you use? whether using adobe premiere pro?

OMG i love you so much! thanks!

An more easy way; background: linear-gradient(rgba(0,0,0,0.5),rgba(0,0,0,0.5)), url(bg.png);

This is very useful note

Where is this when I needed it 6 months ago? 😭😭😭

Thanks dude

Thanks, I need this :')

Man gotta love this girls positivity on the comments section, Anyways nice video, i always wondered how to make a transparent background-image without having a div just for the background image itself hehe

Thank you so much!

That's awesome 👍

Was helpful ..thanx😙

Nice video thanks

Love from India ❤️

"Opacity Calamity" noice

Totally in love with this channel!

Excellent, thank you. What theme do you have for your vsc? , those color are awesome

It is not because I am girl but I see that girls can explain things better than men😄 I really understand concepts better when the teacher is lady go ahead lady

what is your blood type? your editing is so clean