Create A Responsive Bootstrap Website From Scratch
June 30, 2019
37 Comments
➢ LATEST BOOTSTRAP TUTORIAL:
➢ STARTER FILES:
➢ NEW BOOTSTRAP THEME COURSE: (94% Off Link)
➢ SUSCRIBE:
Version 4 Components:
Version 3 Components:
Tags: bootstrap, bootstrap website layout, coding, Create, css3, html, html vs javascript, html5, introduction to bootstrap, Responsive, Scratch, Website
Hey guys thanks for all of the comments and likes on this video! ?
➢NEW BOOTSTRAP COURSE: http://bit.ly/advanced-bootstrap-course (94% Off Link)
I have one problem. When you say What we're using and you have the images below, when im on fullscreen, the layout is going down not across like mobile. Any help would be thankful
thanks for this great tutorial, god bless you! i recommend to use VSCode with linters & live-preview!
for those who have some problems with carousel, carousel prev – next button & hamburger menu: it helped me!
copy paste this links in your <head> section instead of codes that shown on this tutorial:
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/js/bootstrap.min.js"></script>
i can't getting my logo at the right place
Thanks man, this video really helped me.
Great tutorial! But my carousel isn't working 🙁
sir my navbar and slider is not working please tell me what can i do
Thank you so much for this video my friend! Seriously, it was perfect! the speed was good, the examples were good, the content was good! and you have all the links in the description! 1000 thanks!!!
Thank you so much for 1 hour class with you.
Ok so I've spent like an hour trying to figure out why navbar didn't work on lower resolutions.
Let me help you guys, there are few possibilities:
1) Make sure that in <head> importing bootstrap.min.js comes AFTER jquery.min.js
2) Make sure that data-target is referencing the id of navs div like so:
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#myNav">
<div class="collapse navbar-collapse" id="myNav">
3) If everything else fails and you start to doubt yourself and your programming future and when you finally come to the verge of giving up like I did, check for fucking spelling because after an hour of research, switching between browsers and Linux and Windows, it all came down to the fact that I spelled "data-toggle" with one g instead of two.
Because of this kind of retarded mistakes we make, I think its better if you could share the final code in written form with us, so we can more easily check whats wrong.
Fantastic tutorial. Thank you…
Awesome tutorial!
I can't express how much this has helped me. Thank you so much for this video. You made it so clear and easy to understand.
Hey any idea why the carousel next and prev buttons don't work for me? I am using the exact same code as you I even downloaded he starter files
I am getting this error:
Uncaught TypeError: Cannot read property 'offsetWidth' of undefined
at c.slide (bootstrap.min.js:6)
at c.to (bootstrap.min.js:6)
at HTMLAnchorElement.e (bootstrap.min.js:6)
at HTMLDocument.dispatch (jquery.min.js:3)
at HTMLDocument.q.handle (jquery.min.js:3)
sorry drew but i worked almost the same but in small view port. when i click on my toggle button my carosual is dropping down too. plz rectify me my mistake??
nice sir
Does it automatically create a mobile version ?we does not have to to put characterstics of column in bootstrap like xs xl xm?
Great video for beginners. Thanks a lot! 🙂
my navbar has a width of 100% but my carousel does not go across 100%width. Any idea why?
nice tutorial but you should use class icon and not id icon, since id uniquely identifies one element
Just have one problem. The font size of the social media logos isn't changing. Not a big deal but a bit annoying.
My website isnt functioning as it should even though i followed you step by step
Woah, never thought i could create a website just for about an hour. Thanks a lot for this! 🙂
Will it work only on mac books?
I cannot seem to get the codes. Please help! Thank you.
Indentation
Excellent way of teaching bootstarp 4. Really, a big headache has gone. i was struggling for 4 day to assemble my sliced images to form a webpage. Man you nailed it in a 1hr video.
why i can t use the icon-bar class? doesn''t work for me at all
thanks drew Ryan (y)
so my buttons and carousel and drop down menu dont work is it possible that one of the links for bootstrap or js for bootstrap is outdated
Thanks Drew Ryan. You are a prefect instructor. Thanks for your teaching.
Good job with the video, although i got a kinda silly question but i cant find answer, The brand icon overlaps the line when you go into "mobile" view, I add some css (margin:10px to mobile navbar when is open) and worked . Any tip?
Intresting video
Hi. Can you explain how to set custom width for collapse button? Example: I want menu to collapse at exactly 1005px width.
Thank you.
these 3 line icons doesnt appear
Enjoying the tutorial – It's helping a lot. I've gotten to 46:00 and have added the .icon{} class, but when I refresh all the elements(the html5, css3, bootstrap row) stay centered… Is it anything to do with one of the internal bootstrap-classes?
Thanks in advance
awesome tutorial, made mistakes at first but went back and did it all over again and it worked perfect