Too much easy lacture sir itna easy nhi tha jitna Apne smjha kr krdia hai maene koi 30 plus videos dkhi thi lkn smjh blkl ni ai Apne bht acha btaya and successfuly MRI same ban Gai website
@@GowthamTirri hi bro. I have a problem with the 4 pictures on section "UPCOMING TOURS & DESTINATION". I am trying to fix it. if i say "width: 50%;" Its not working.
@5:00 using v min for font size will make it responsive but also going to impact the zooming ability as while zooming in the site text will not get bigger in size
Great tutorial. Thanks for that . But one question. At 28:03 you ad "image-col" to the "col"-class.Seconds later it is deleted. No matter, what I do, the gallery won't appear in 2cols and 2 rows, but 1col 4 rows. It drives me crazy, that I cannot find the point, where it doesn't work.
Thank you so much for this video! I love that you explain what you are doing and showing us what is being done on the website. Your channel deserves to have way more subscribers, thank you!!!
You have explained concept well and made good website. It helped me out to understand animation and responsive website. Please do share html file as well.
Hi. What can be the reason that my image is not resposive?I work on mac desktop and the screen is very wide. The image covers only half of the screen. I follow your tutorial step by step and at the point where we gave selectors to the header in css i started to have a problem. is there is a way to adjust an image? while i did found a mistake instead of width 100vw i wrote q 100 vh. but now i have another problem when i enlarge the screen the whole view of the picture isn there . Just the enlarged part of the image.
I'm not sure if I'm missing something but i cannot understand how you're able to link your photos in css. Ive tried going about it the same way you did and it does not work?
In css i wrote the same things as shown in this video example navbar and it reacts opposite background image comes to half screen of computer i dont know why
Sir Arrow would arrow function work in all devices.. My toggle property ia not working.. I guess it is because of arrow function which is advanced function
As you make website after zooming all the stuff get spoil you know about it if we zoom after making website using htm k and css Plz reply and have me solution plz reply 🙏
Bonjour, je suis bloqué à partir de @14:00 , je ne comprends pas pourquoi le "mobile-menu" n'est pas en HTML ? lorsque je clique sur l'icone en haut à droite pour voir le menu, il n y a aucun changement. Merci de votre aide !!!
Excellent Tutorial!! Very well explained, step-by-step tutorial on creating a responsive website. I especially like that the website layout is created using flexbox (and no framework). Thank you for sharing. One question for you. If one wanted to animate the mobile menu icon, for example, by toggling the hamburger image with an image of X, how would one modify the CSS and JS?
i need the source codes , but you placed an amount of $3 , i am having issues with card,how do i do a transfer , kindly provide account details , waiting for your response
Thank you sir for making this vedio. Explanation is very clear. please if you could start small course on CSS it is very helpfull to us. You deserve More SubScribers.
Excellent video, only issue is, i did what you did with the navbar, but somehow it doesn't line up into one row (like u have). I dont understand why, someone have an explanation on why it won't shift?
My nav links dont get the white colour, and when I put the class active to the "home" it was supposed to be pink, but then it got white hahahah, can't figure whats going on
Thanks for this! I tried doing everything the exact same way. However, the nav links don't turn into the whitesmoke color.. don't know why... I'v done exactly everything you've done
i got one small issue that my menu button is not creating an animation whenever we click on it. Also my text color is not visible(white). Please can you help me out there?
It's a great tutorial but could be easier to follow. Newbies beware even someone with 3 years under their belt found this hard to follow but only because there was constantly jumping around to different lines. This is understandable however it could again be cleaner
I feel that you should next time start from the start by showing people how to insert a imag etc. I’m pretty sure many people were lost but your explanation is very Good. Also go abit slower.
Can I ask, why the menu bar doesn't appears on the mobile view? I click right on the bar menu icon and it just doesn't appear the menu, idk what to do or if I just did something wrong because everything it's just as in the video. :(
Hi, the two photos in the event section, when you try to decrease the screen size(ie browser tab), the margin between two photos get disappeared and it looks like both photos are connected or glued or no margin is there and it shows bad animation during hover. In the Media query the photos are coming ok as its direction is column but this issue happen between before reaching media query condition. go to 34:07 and pause you will see it. Any tips? Also the images are not of the same dimension, so the alignment is not matched between the photos. Great Tutorial Btw.
@@marvinferrer5099 I don't remember the solution but what I did I think is I added a margin-left and margin-right for both photos so like that it will have some space in between and also on the right and left side. Also for the photo's dimension give same height for the div element in which these photos are stored and stretched the photo i.e fill. if they are not in a div element just make one
1-on-1 Classes with me : www.buymeacoffee.com/gowthamtirri/e/219232
Source Code :www.buymeacoffee.com/gowthamtirri/e/97581
So far the only tutorial I've seen that takes it slow and doesn't require prior experience to soft design.
may i have the code? because the results do not match the video
Hi, does this work for multiple platforms? (website adapts to phone, laptop etc?)
Yes it is a responsive design.. works in every platform
Yes.
Too much easy lacture sir itna easy nhi tha jitna Apne smjha kr krdia hai maene koi 30 plus videos dkhi thi lkn smjh blkl ni ai Apne bht acha btaya and successfuly MRI same ban Gai website
Sir, you make the best HTML/CSS tutorials on youtube -- You ROCK!!😀
You're Amazing! ❣️
@@GowthamTirri urdu or hindi main banow sir jee
@@GowthamTirrieveryone can't understand English including me ❤
@@GowthamTirri hi bro. I have a problem with the 4 pictures on section "UPCOMING TOURS & DESTINATION". I am trying to fix it. if i say "width: 50%;" Its not working.
@5:00 using v min for font size will make it responsive but also going to impact the zooming ability as while zooming in the site text will not get bigger in size
@Entertainment Roller Coaster
Bad. When you zoom in the text should get bigger.
the script type of mobile- menu is not working for me, some help.
for me too & source code is paid
Great tutorial. Thanks for that . But one question. At 28:03 you ad "image-col" to the "col"-class.Seconds later it is deleted. No matter, what I do, the gallery won't appear in 2cols and 2 rows, but 1col 4 rows. It drives me crazy, that I cannot find the point, where it doesn't work.
i found this problem, and others: images in "events" shows full size and doesn't show in responsive mode
Hi. I'm having the same problem. Can you tell me how I fix this?
The clarity in your explaination is soo good ..you deserve more subscribers
Thanks neeharika
Thank you so much for this video! I love that you explain what you are doing and showing us what is being done on the website. Your channel deserves to have way more subscribers, thank you!!!
Thanks Christina, so glad you liked it.
@Christina
Can you provide me those images, please?
You have explained concept well and made good website. It helped me out to understand animation and responsive website. Please do share html file as well.
Excellent work bro from london great video and content, keep it up one of the best online design was really great
THE BEST TUTORIAL EVER MADE...Thanks bro
Thanks bro really appriciate, more knowledge to come bro
when you click one of the button in navigation bar will it bring you to another section??
Great video ,but some of the css features are not working in my project,y?(I'm using pycharm )
Where can i get class mobile-menu in responsive navbar....i dont get that class in your index.html
yes exactly where is mobile-menu?
Why did you linked google fonts if you won't use it?
Why do you use two heading h1? In the same document?
love your class!
I am already a developer but don't know how to create a beautiful responsive website, but I know the codes.
Thanks for your tips.
Glad, you loved it ❤️
Greatly appreciate your video! It really helps!
Hi.
What can be the reason that my image is not resposive?I work on mac desktop and the screen is very wide. The image covers only half of the screen. I follow your tutorial step by step and at the point where we gave selectors to the header in css i started to have a problem.
is there is a way to adjust an image?
while i did found a mistake instead of width 100vw i wrote q
100 vh.
but now i have another problem when i enlarge the screen the whole view of the picture isn there . Just the enlarged part of the image.
Thank you so much Anna .
It is really helpfull.
Make some more videos.
Why you make header-content flex end when you can use center ?
I'm not sure if I'm missing something but i cannot understand how you're able to link your photos in css. Ive tried going about it the same way you did and it does not work?
Thanks bruh i learn a lot from this video, really eager to watch more videos of yours in future
Im glad you liked it. ❤️
In css i wrote the same things as shown in this video example navbar and it reacts opposite background image comes to half screen of computer i dont know why
Bro I should tell you you are gonna be a big CZcamsr, cause your explanation is good as well as your work ethic .
Glad you liked it ❤️
Sir Arrow would arrow function work in all devices..
My toggle property ia not working.. I guess it is because of arrow function which is advanced function
Not because of arrow functions, it maybe another thing in your code
Thank u so much man, keep up the awesome work.
where is .mobile-menu class in html file?
The link to the images don't work :(
Thanks man, I reference the link to this video on my site since it was so efficient and useful.
I'm loving the content so far, but I have trouble with my background image, it is only appearing on half the screen
When I insert the second img, it sits on top of the first img instead of being under it😢
My images are not resizing, what could be the problem
When I paste your same images, mine look smaller with more space between them. Could I have done something wrong?
The link on the css where did it come from??
How can I get the nav bar working for example when click about us
Take to that part
please someone answer me, where did this .mobile-menu come from?
Thank You so much! Excellent Tutorial!
My menu bar is not changing pages when I click. I don't know what's happening. T_T
Really awesome!
As you make website after zooming all the stuff get spoil you know about it if we zoom after making website using htm k and css
Plz reply and have me solution plz reply 🙏
In navbar, when I make its position: absolute, I can no longer use justify-content property. Do you have any idea how to fix that problem?
I loved this awesome tutorial! Thank you!!
for a beginner this is amazing. Great work you're doing, just want to add the image's link does not really work.
image file shows error : file is in owner's trash. and not able to download
Website ke report bna k dy den gy ap??
please upload figma as well of this design
the @media only screen and (max-width:850px) is not working, why is that?
can you explain about that "mobile-menu" class which you used while making the navbar responsive
My question is same
@@charusheelabari5257 put it here with navlinks
bro from where get the images?
As a beginner this tutorial is amazing!!! thank you so much....
Glad you liked it
@Muskan Can you provide me those images?
Yo bro can you plzz guide how to get that background pictures
Thank u for tutorial 👍
me encanta lo voy a hacer justo lo que estaba buscando
Can i get the inages you used the drive link has been expired
love u bhai for awesome tutorial.Please keep guiding noobs like us.
please make react project my dear bro it will be really helpful bcoz the way your are teaching so clear..
Soon..
sir in poppins exactly which font to select please metion in your comment section
Bonjour,
je suis bloqué à partir de @14:00 , je ne comprends pas pourquoi le "mobile-menu" n'est pas en HTML ? lorsque je clique sur l'icone en haut à droite pour voir le menu, il n y a aucun changement. Merci de votre aide !!!
Incredible video, keep up the awesome work! :)
Thanks
@@GowthamTirri hey can you tell me why did you
give left and top zero in navbar
Excellent Tutorial!! Very well explained, step-by-step tutorial on creating a responsive website. I especially like that the website layout is created using flexbox (and no framework). Thank you for sharing.
One question for you. If one wanted to animate the mobile menu icon, for example, by toggling the hamburger image with an image of X, how would one modify the CSS and JS?
❤️ I really appreciate your comment,
you can do something like this
//change icons in navbar html
X
//In JS
const mobileNav = document.querySelector('.mobile-nav')
const menuBtn = document.querySelector('.menu-btn')
const navlinks = document.querySelector('.nav-links')
const closeBtn = document.querySelector('.close-btn')
mobileNav.addEventListener('click',(e)=>{
navlinks.classList.toggle('mobile-menu')
if(e.target === menuBtn){
menuBtn.replaceWith(closeBtn)
closeBtn.style.display = 'block'
}
if(e.target === closeBtn){
closeBtn.replaceWith(menuBtn)
}
})
@@GowthamTirri Thank you so much.
@@GowthamTirri your github id
Ummm, my background image is not getting inserted.....What to do now?
Thankyou for your guidance 🎉🎉🎉🎉
i need the source codes , but you placed an amount of $3 , i am having issues with card,how do i do a transfer , kindly provide account details , waiting for your response
Thank you sir for making this vedio. Explanation is very clear. please if you could start small course on CSS it is very helpfull to us. You deserve More SubScribers.
I'm glad it helped you, I'll bring more css projects :)
my navbar - the hambarger doesnot work.
Excellent video, only issue is, i did what you did with the navbar, but somehow it doesn't line up into one row (like u have). I dont understand why, someone have an explanation on why it won't shift?
My nav links dont get the white colour, and when I put the class active to the "home" it was supposed to be pink, but then it got white hahahah, can't figure whats going on
same problem, have u fixed it?
28:50 the images dont go in a collum. Tutorial sometimes kinda buggy dude. Overall 3-5
Also your navbar doesnt work if you actually wanna use it
heyy
how can I fix it?
I really love this project
Is it responsive because my background is changing in different devices in my pc
Thanks for this!
I tried doing everything the exact same way. However, the nav links don't turn into the whitesmoke color.. don't know why... I'v done exactly everything you've done
Make sure you target "a" tag in css
Cannot download images.. help
i got one small issue that my menu button is not creating an animation whenever we click on it. Also my text color is not visible(white). Please can you help me out there?
I can help you with source code. Dm insta
its good so good work , you must precise a reponsive witdh max right at the end
It's a great tutorial but could be easier to follow. Newbies beware even someone with 3 years under their belt found this hard to follow but only because there was constantly jumping around to different lines. This is understandable however it could again be cleaner
Thanks Kylie, Constructive feedback 🙌
Thanks for the Video.. 🥰🥰🥰
Nice work, can you explain how mobile-menu at css works?
Great Video. Thank you very much for the tuition.
❤️
I feel that you should next time start from the start by showing people how to insert a imag etc. I’m pretty sure many people were lost but your explanation is very Good. Also go abit slower.
Insightful, thanks for the comment.
Awesome Course for Learning HTML5 and CSS3 #CodingWithRohani
❣️
Your intro is fire🔥🔥🔥
Only a few people appreciate these kinds of things, Thanks mate! ❣️
Sir there is no class given as mobile menu but we add css why?
Same question 😭
Can I ask, why the menu bar doesn't appears on the mobile view? I click right on the bar menu icon and it just doesn't appear the menu, idk what to do or if I just did something wrong because everything it's just as in the video. :(
Same
@@amishapatel849 found any solution?
Coz i too have that same error
Mee too broo
Instead of giving css property of menu-btn to class give it direct to img tag itselft and also in Java script for queryselector use (img)
@@dimpalnakum6869 how
i was to ask, even tho i followed every steps, the alignment on my items is center but when its on the live website it isnt centered
same here, for me the issue is with the navbar that it wont align into 1 row, were u able to solve this
What is your VS Code template?
Thank you so much, god bless you.
Hey bro👋
Please my image gallery does no appear in grid form as yours.
It's displayed vertically.
I've followed all the steps.
Please help🙏
I seem to have the same issue any solution ?
Dm in insta for source code
Why did you stop posting videos..... Your videos are great for learning 🔥🔥
Coming soon.. ❤️
very nice explain i like it
This has helped me so much thank you.
Bro how did he get such type of images i mean blackish type
You can get tons of free images from these websites, add some edits as needed
pixabay.com/
www.pexels.com/
@@GowthamTirri Thanks bro, btw awesome tutorial ♥️
Thank you for this turtorial!
It is *tutorial*
Just like any other developer, he did a typo* my friend 😅
thanks a lot man
Nice video Bro. But you're very fast. Try taking it easier in subsequent videos. It will help everyone follow along better.
nav shouldn't be inside the header?
Not necessarily.
You explain wowwwwwwww
With live server
Hi, the two photos in the event section, when you try to decrease the screen size(ie browser tab), the margin between two photos get disappeared and it looks like both photos are connected or glued or no margin is there and it shows bad animation during hover. In the Media query the photos are coming ok as its direction is column but this issue happen between before reaching media query condition. go to 34:07 and pause you will see it. Any tips? Also the images are not of the same dimension, so the alignment is not matched between the photos. Great Tutorial Btw.
Same issue that that i have encountered, have you found the solution for this?
@@marvinferrer5099 I don't remember the solution but what I did I think is I added a margin-left and margin-right for both photos so like that it will have some space in between and also on the right and left side. Also for the photo's dimension give same height for the div element in which these photos are stored and stretched the photo i.e fill. if they are not in a div element just make one