You are so good at teaching, this is the best tutorial series I've watched, all the solution for the problems that I encounter when I did my first website is all here. Thanks man!!
You look like Elon Musk a bit... On a serious note, I started studying HTML and CSS and the videos that the teacher sent are 3 hours long...your course is WAAAYYY better than those from Linkedin Learning. Thank for that!!
I follow your tutorials and think they are great! I have one question tho, when I use visibility collapse in CSS it doesn't flicker either… is there a disadvantage of using that?
Bro, I'm taking a class in HTML right now, and my professor has 0 lectures. I've been watching you alongside the readings, and you're so good at teaching. Sincerely, thank you 🫡
huh, you too? my ex teacher was the same, he comes late and then goes to the restroom and does nothing. These type of videos made me pass his lesson with very high grades at least
Whenever I adjust the image height and width from within the img element in HTML it works, but when I target it with a class is CSS, nothing changes. I'm linked to the correct stylesheet.
Another terrific installment, Dani. I really appreciate many things you are doing, but keeping best practices and semantics in the forefront seems essential for success. Thank you, as always, for your incredibly considerate instruction!
This was really helpful though at first I couldn't hear much of his words but has I sat in from of my PC and rewatch the video for a few rounds. I was able to understand better. 👍👍👍
what if in the .image you put backround-image: src="the source of the image that you want when you hover" then after that you put the source of the image that you want before hovering so that it reads the first image src then reads the new one, will that load the image?
Hey! It's me again from sololearn. I like how you show us different scenarios for an element before showing us the actual solution . Like saying "if we were to set the width to 50% see how it looks." While knowing we are actually supposed to set the width to maybe 100%. I Just like the way you give us a glimpse of most of what we need and want to know. Great Lesson btw. 👍
I'm currently having this issue where my image isn't showing up in the browser but is in my test window (using dreamweaver which has a live view). It works perfectly fine if I attach it like a normal image but when I embed it in a class as "background-image: url()" it won't show on my browser. Any solutions?
Clear your browsers cache or “hard refresh” it, and if that doesn’t work, then it is most likely because you have the wrong file open in the browser. 🙂
@@Dani_Krossing I tried all that but then had the thought of using the inspect panel on chrome like you've said and it's showing an error: "failed to load resource: the server responded with a status of 404 (not found)" but I don't understand why chrome can't find the file but dreamweaver's live mode can?
@@Dani_Krossing Ok I'm really dumb, I've never set up my folders like you have so my CSS file is normally with all my HTML files. However this time I set it up your way and when I added the image I added it as "background-image: url(/img/cover_1.jpg);" which meant that dreamweaver could find it but I needed to add the ".." like you did which is why it wasn't working on the website. Thank you for your help though, as resetting the cache did fix some small CSS stuff that was bugging me.
Hello, I wrote the same lines/code for CSS and HTML but when I do Go Live from VS Code for the first time the Image blinks, once the page is opened then on page refreshing it's fine. My code is like this (Sorry for pasting here but I want to resolve this issue :( ) body::after { position: absolute; width: 0; height: 0; overflow: hidden; z-index: -1; content: url(../images/coffeehouse-b&g.jpg); } .image { width: 300px; height: 400px; background-image: url(../images/coffeehouse.jpg); background-size:cover; background-repeat: no-repeat; background-position: center; transform: all ease-in-out 100ms; } .image:hover { background-image: url(../images/coffeehouse-b&g.jpg); }
Thank you for the education, sir. but I practiced as you showed me. In my case, I did as you did, but the image did not appear when I used the class to insert the image. so what's the problem sir? Why can't I like what you do? I so very helpful if you want to answer
i've been trying to figure out how to put text beside the image and I'm still having trouble, messed around with margin and float but it didn't work. the text keeps going underneath the image, finally got it to work but moving the text away from the image so it doesn't collide was a problem that's why i used margin it worked but i only wanted to use the margin for the text and not the image, whenever i use margin top it also does it for the image and I'm trying to align the text to be in the middle beside the image, what do i do to make it work (I'm using CSS to do it)
Good morning. This video partly useful only because some of your code is cut off. Line 6 in the html module and line 4 in the main.css module. I don't if your notice it after you posted it.
You are so good at teaching, this is the best tutorial series I've watched, all the solution for the problems that I encounter when I did my first website is all here. Thanks man!!
You look like Elon Musk a bit... On a serious note, I started studying HTML and CSS and the videos that the teacher sent are 3 hours long...your course is WAAAYYY better than those from Linkedin Learning. Thank for that!!
another very good installment from mr Krossing.
I follow your tutorials and think they are great! I have one question tho, when I use visibility collapse in CSS it doesn't flicker either… is there a disadvantage of using that?
Bro, I'm taking a class in HTML right now, and my professor has 0 lectures. I've been watching you alongside the readings, and you're so good at teaching. Sincerely, thank you 🫡
huh, you too? my ex teacher was the same, he comes late and then goes to the restroom and does nothing. These type of videos made me pass his lesson with very high grades at least
Why when I do the (/) slash thing for the css files, it doesn't seem to work unlike the one Dani's using?
the way you explain is absolutely clear and to the point. Thanks !!
Thank you so much
Whenever I adjust the image height and width from within the img element in HTML it works, but when I target it with a class is CSS, nothing changes. I'm linked to the correct stylesheet.
Well teacher, I follow your coaching ...
Is there an easier way to just set the image in the center of the page? Or is that always done via a margin value?
align-center. I think.
I love this page, holy shit. good job bro, great teacher!
So the folder, image, and index.html should all be saved to C; Drive?
No, it needs to be inside the website rootfolder. The rootfolder can be anywhere.
Another terrific installment, Dani. I really appreciate many things you are doing, but keeping best practices and semantics in the forefront seems essential for success. Thank you, as always, for your incredibly considerate instruction!
I'm first
image just pop up on web as a small icon, any suggestions please
thanks for lesson. i appreciate it and learned a lot from it.
Mine is not working, i kept creating the image folder and it's still not working
This was really helpful though at first I couldn't hear much of his words but has I sat in from of my PC and rewatch the video for a few rounds. I was able to understand better. 👍👍👍
What app are you using pls
what if in the .image you put backround-image: src="the source of the image that you want when you hover" then after that you put the source of the image that you want before hovering so that it reads the first image src then reads the new one, will that load the image?
Hey! It's me again from sololearn. I like how you show us different scenarios for an element before showing us the actual solution . Like saying "if we were to set the width to 50% see how it looks." While knowing we are actually supposed to set the width to maybe 100%. I Just like the way you give us a glimpse of most of what we need and want to know.
Great Lesson btw.
👍
OK. Very good. 4 minutes of html and 16 minutes of css.
Great
Thank you dani
Good lecturing
Your coding is quite completed, you know plus description for that particular pic lol
Basse 😍 we need more doggo again hehe
I'm currently having this issue where my image isn't showing up in the browser but is in my test window (using dreamweaver which has a live view). It works perfectly fine if I attach it like a normal image but when I embed it in a class as "background-image: url()" it won't show on my browser. Any solutions?
Clear your browsers cache or “hard refresh” it, and if that doesn’t work, then it is most likely because you have the wrong file open in the browser. 🙂
@@Dani_Krossing I tried all that but then had the thought of using the inspect panel on chrome like you've said and it's showing an error: "failed to load resource: the server responded with a status of 404 (not found)" but I don't understand why chrome can't find the file but dreamweaver's live mode can?
@@Dani_Krossing Ok I'm really dumb, I've never set up my folders like you have so my CSS file is normally with all my HTML files. However this time I set it up your way and when I added the image I added it as "background-image: url(/img/cover_1.jpg);" which meant that dreamweaver could find it but I needed to add the ".." like you did which is why it wasn't working on the website. Thank you for your help though, as resetting the cache did fix some small CSS stuff that was bugging me.
Hello, I wrote the same lines/code for CSS and HTML but when I do Go Live from VS Code for the first time the Image blinks, once the page is opened then on page refreshing it's fine.
My code is like this (Sorry for pasting here but I want to resolve this issue :( )
body::after {
position: absolute;
width: 0;
height: 0;
overflow: hidden;
z-index: -1;
content: url(../images/coffeehouse-b&g.jpg);
}
.image {
width: 300px;
height: 400px;
background-image: url(../images/coffeehouse.jpg);
background-size:cover;
background-repeat: no-repeat;
background-position: center;
transform: all ease-in-out 100ms;
}
.image:hover {
background-image: url(../images/coffeehouse-b&g.jpg);
}
This is the second video I've watched and the instructor failed to show a download from the a webstie and show it was working in CSS
🖼 Maybe you could talk about ?
Once I get into responsive design, I will talk about 🙂
amazing i can do so much more know
Thank you for the education, sir. but I practiced as you showed me. In my case, I did as you did, but the image did not appear when I used the class to insert the image. so what's the problem sir? Why can't I like what you do? I so very helpful if you want to answer
i've been trying to figure out how to put text beside the image and I'm still having trouble, messed around with margin and float but it didn't work. the text keeps going underneath the image, finally got it to work but moving the text away from the image so it doesn't collide was a problem that's why i used margin it worked but i only wanted to use the margin for the text and not the image, whenever i use margin top it also does it for the image and I'm trying to align the text to be in the middle beside the image, what do i do to make it work (I'm using CSS to do it)
Good morning. This video partly useful only because some of your code is cut off. Line 6 in the html module and line 4 in the main.css module. I don't if your notice it after you posted it.
ayy are u danish
why do guys always do quality videos with blur cameras
Blur camera? If you mean my facecam, then I see no blur. 🙂
Pin me
Your faces is similar Elon Musk
for free ?!?!?!?!?!?!?!?!?