For anyone reading this in the future who is learning about media queries. I would highly , highly recommend when you are starting to css up your HTML to start from mobile first and then code upwards instead of coding from desktop to mobile. It really helps, and i find I write less code
I've learned a lot in this episode alone, these tutorials have been fantastic! well paced and well explained. Hands down the best tutorials on web development i've seen and i've look all over YT. Thanks for these Shaun.
Thank you for adding this here! Let me say that when you write html5 and hit enter in Visual Studio editor it adds this on its own, along with doctype etc.
You are a GOD! thank you, I've just started learning frontend developement and this is very helpfu. I bought full course of yours on Javascript on Udemy. Best regards! :)
Such a great vid! I was just wondering how much do your Udemy courses differ from your tutorials on youtube? Thanks so much, your vids are an invaluable resource!
Great lesions, you are a very talented teacher. I learned so much with your help! When after watching I tried using the code /@media screen and/, the "screen and" part was not recognized by vscode. I read online, started watching, but still there was no help in this particular thing. Can someone help mi with this, where is my mistake?
If you are doing this for learning purpose then it is ok. But if you are making a website for commercial use then you have to focus on every device. Because according to user to user resolution may vary.
@@antragupta7831 Man, one day? I think you are just refreshing what you already know. I've been watching it for 1 whole week, still not able to fully wrap my head.
You're great at engaging your audience. Some online instructors sound bored when they teach. A lecture is less fun when you think the instructor doesn't like their job.
Hi NetNinja, was hoping if you can make a website using the best practice as what you mentioned which is mobile first approach. Would be very awesome if you can so we can pick up best practices on how to handle this approach. Total beginner here.
I just finished learning HTML and CSS and it seems responsive web design is a must know package too. Is it important that I do a complete course on responsive Webdesign or else all these are included in the bootstrap framework.
hi mr.ninja. this is too much to ask but. im a beginner as in zero knowledge and your tutorial helps me a lot! .. can you show as how to make a webpage in a mobile device first style approach. as you said it is easier to do than in the larger device. thank you so much for this wonderful tutorials. hope to find a job soon. :D
Totally brilliant! Simple, direct and concise! Really good pace! I can't thank you enough! I've been looking forward to learn modern HTML and CSS in a practical way and this series is, IMO, unbeatable! Thank you! Thank you! Thank you! You, good sir, are a true mentor!
Hi, Ninja. I tried to remove the thin white line below the banner image. I can't seem to figure it out why it is there as I played around with padding, margin, and positions.
Can be fixed with .banner { position: relative; top: 5px; } as the banner is hidden behind the You will need to alter the media query for smaller screens as the is no longer fixed @media screen and (max-width: 560px) { .banner { top: 0; } }
This doesn't look great at 2048 x 1280 display dimensions either though because the banner image width is lacking. Only way to fix that is to set it as a background image on a div and maybe repeat it on the x-axis?
Awesome tutorial, but I'm not sure why the big yellow image "banner.png" does not extend all the way on the right side of my 1920 resolution screen. I copy pasted your code as well and it's the same.
That was a superb course! Many thanks 'Mr Ninja' ; ) I have a quick question if I may ...................... What if I wanted to use an image as a background and have all my content on a 'transparent layer', while reading the article you would simply scroll down the page, and the 'background image' would remain in place. As you explain everything so well, would you be so kind as to show us how please. Many thanks for your time. TURK
