#12 - Bootstrap Navbar - (தமிழில்) (Tamil) | Bootstrap Course | Web Design

[@dhivyatamil4332]

Crystal clear even after 3 years Thanks bro

[@creativeworldindian]

The whole Bootstrp tutorial is really easy and effective. Anyone who wants to learn in Tamil, this is one of the best tutorial. I really appreciate your effort and time.

[@CyberDudeNetworks]

Thank you for your time in commenting :) Appreciable. Comments like this motivate us and push us to proceed forward :)

[@Narendiranath]

Your work is must appreciate Nanba! God bless you!

[@CyberDudeNetworks]

🤝

[@RAJAN-lk1re]

Bro enaku un-ordered list la ml-auto function work aagala aprm antha active function um work aagala...bro enaku drop-down aagala

[@ronaldomano9540]

Bro bootstarp 5 ku ms-auto thaan work aagum

[@ashwinprashanthparthiban8691]

Brother, nav pills la, inside tag() , data-toggle kudutha, href la irukura link not working, epdi itha solve panrathu... please sollunga seekram ah.

[@CyberDudeNetworks]

Can you do a fork on codepen and share the link?

[@ashwinprashanthparthiban8691]

@@CyberDudeNetworks brother, naa design mathiten, but problem oda screenshot plus code ungaluku share panren soon.. Thank you brother

[@balavigneshs3724]

Sir, at 5:40, it is given as href="/". please explain what that forward-slash(/) or root means?

[@CyberDudeNetworks]

href="/" points to root of the website, for example: If you visit example.com/about.html and if you have href="/" in the about.html file, when the user clicks, it will learn the example.com/ (which is document root) root is nothing like, document main entry point. If you created index.html file and if you open the url, you can access the website without specifying index.html, because by default, default.html & index.html will be loaded by the server.

[@MuthuKumar-qx2ne]

Bootstrap beginners direct aa latest version la irunthu start pannalama?

[@abinayas6221]

this is best actually starting pakumpotu confidence kamiyachi try pana web page connect panddra

[@CyberDudeNetworks]

:)

[@dilakshankamalathasan6070]

anpu anna in bootstrap ml-auto, fs-5, mr-auto, ippidi prporties type panrathu paththi documenttation enka anna irukku? official side la kanala anna, and if you can make a seperate video.

[@CyberDudeNetworks]

Please check the video on the series itself, the video title is "Migrating from bootstrap 4 to bootstrap 5".

[@sibilaila8874]

When we are adding "#" to the myNavBar in data-target , the dropdown was not working. why??

[@CyberDudeNetworks]

Check if you are using Bootstrap 5, If you are using Bootstrap 5, some code has been changed. Please check this video: kzbin.info/www/bejne/h6nEgHaXds6aqMk

[@murad1194]

Jazakhalla khair bro god bless you 🙏 🙌 ❤

[@AbdulRahman-bq9yz]

Bro, navbar-nav la ml auto kudutthalum menus left side pogalaye. Y bro? Neenga use panna ella methodayum correct use pannithan pannen. but result varala bro. ML-AUTO kuduthum en varala? Pls tell me the solution.

[@lakshmanking823]

ms-auto kudu bro it will work

[@AravindanS-e2z]

D-block pannitu kudu bro

[@chayankumar_cj]

do i need to add anything

[@naveensarathy3632]

bro ml-auto kodutha align aagamatudhu bro ?

[@CyberDudeNetworks]

May be if you are using Bootstrap 5, you have to use ms-auto instead of ml-auto Check this video: kzbin.info/www/bejne/h5W3hH2AhLmVpsk

[@ariharasuthan_g]

@@CyberDudeNetworks tysm broii #anbu ❤️

[@m.ganeshkumar4126]

Oru sela classes work aga mattuthu bro why?

[@CyberDudeNetworks]

Its because some code has been modified in Bootstrap 5, check more info here: kzbin.info/www/bejne/h6nEgHaXds6aqMk

[@m.ganeshkumar4126]

Mm ok bro

[@tbc6583]

Good explanation ❤

[@VijayVijay-rj7wz]

13:54 alignment home , about right side end la varala and button not working bro

[@CyberDudeNetworks]

You might be using Bootstrap 5. all ml-*, pl-* has been replaced with ms-*, ps-* Likewise all mr-*, pr-* has been replaced with me-*, pe-* l means left -> replaced with s (start) r means right -> replaced with e (end) We have a video on that kindly watch it in our channel: kzbin.info/www/bejne/h5W3hH2AhLmVpsk

[@VijayVijay-rj7wz]

@@CyberDudeNetworks thanks bro

[@naveenrockx]

After completing react work we can element responsive design

[@rinupaskaran6843]

Hi, Navbar Toggle not close automatically when click toggle button again. Please help me resolve this

[@CyberDudeNetworks]

Check the errors on your console, it should help you.

[@rinupaskaran6843]

@@CyberDudeNetworks there is no error and also i have copied toggle button code from bootstrap documentation. that is also not closing automatically.. is there any script should i insert?

[@lokeshv8999]

Thanks bro waiting for this topic

[@Raj_1411]

Ml-auto work aagala... Bro

[@CyberDudeNetworks]

Replied.

[@archanaaradhakrishnan5376]

bro i need to make the link hover style what to do?

[@CyberDudeNetworks]

You can add your custom CSS to that link. Kindly check this video: kzbin.info/www/bejne/a3WrXoqAlNCZoLc

[@CSaravanan007]

Hi Bro.. am not getting data in the dropdown.. and also ml-auto moves the content to the middle, not to the right end... I have tried everthing as you mentioned.. pls help me out...

[@CyberDudeNetworks]

ml-auto has been renamed to ms-auto More info here: kzbin.info/www/bejne/h5W3hH2AhLmVpsk

[@CSaravanan007]

Thanks bro... Also, the data in list is not showing in toggle drop-down... Any clue to check?

[@CyberDudeNetworks]

Have you imported the js script tag?

[@CSaravanan007]

Yes bro

[@jayasuryaraja1212]

script la js.bundle use pannuga bro dropdown work agum

[@aiswaryalakshmi7930]

What is the use of href=# in bootstrap navbar

[@CyberDudeNetworks]

What suppose, if you want to navigate to homepage when clicking logo? That's why href is used. Used to navigate between webpages. Hope you can understand.

[@aiswaryalakshmi7930]

@@CyberDudeNetworks So href="#" is given means it will navigate to homepage.right?

[@CyberDudeNetworks]

If you have href="/" it will navigate to / (homepage)

[@aiswaryalakshmi7930]

@@CyberDudeNetworks Then href="#" given means it will navigate to where?

[@mohamedabbasabs7123]

Bro mobile view na icon touch paninenan work aavala

[@CyberDudeNetworks]

Have you included bootstrap script in your html document?

[@Raj_1411]

Ml-auto kudutha left la pogala anna... Solution sollu na.... Pls

[@CyberDudeNetworks]

Check this: kzbin.info/www/bejne/h5W3hH2AhLmVpsk

[@Raj_1411]

Ok anna... Done.. 🥳

[@sugumarr6180]

Hii bro.. ml-auto and target work aagala bro

[@CyberDudeNetworks]

If you are using Bootstrap 5, you need to use ms-auto instead of ml-auto More info in this video; kzbin.info/www/bejne/h5W3hH2AhLmVpsk

[@royalmano7834]

@@CyberDudeNetworks bro thank you bro i ask a question and i read a comment one by one i this comment ml-auto was not work in my cord and i see this comment it work thank you bro👌👌👌👌

[@Benny1704]

everything is working except the collapse is not opening. naane code pana varala and bootstrap code copy pana apayu varala. i tried in both edge and chrome . what might be the issue? plzzzzz do help

[@SURYAPRAKASHCS-fs5yf]

Same Problem 😂

[@jagdeshs8762]

Bro na img right la float pnalu apm Nav la Margin left kuduthalu adhu right la move agamatikidhu bro....

[@CyberDudeNetworks]

If you are are using bootstrap 5: Watch this: kzbin.info/www/bejne/h5W3hH2AhLmVpsk

[@jagdeshs8762]

Thank bro💥👍

[@prabhuganesanin]

Bro, enna extension use pannuring for checking device sizes...

[@NandhaKumar-yq4wc]

Bootstrap 4 Viewport

[@sivakumar-qf9gd]

Ivlovum niyabagam vachikanuma just copy paste panna podhuma

[@CyberDudeNetworks]

Just know, how it works, you can copy and paste and implement it.

[@sounderpandi4325]

Bro ml-auto work agala..

[@CyberDudeNetworks]

In bootstrap 5, it has been replaced from ml-auto to ms-auto and mr-auto to me-auto. More information on this video: kzbin.info/www/bejne/h6nEgHaXds6aqMk

[@sriram2394]

Broo...video is awesome...ellamey panten!...but enaku ml-auto matum work aaga maatingidhu!...enna bro panlam???

[@CyberDudeNetworks]

For solution, watch this video: kzbin.info/www/bejne/h5W3hH2AhLmVpsk

[@venkatgameonid162]

Even toggle is not working bro

[@ragulsakthivel2684]

Wonderful explaination bro.... 🔥

[@CyberDudeNetworks]

Thanks ✌️

[@balavigneshs3724]

Sir, at 22:50, if id attribute is not given dropdown works. How sir?

[@CyberDudeNetworks]

Nice question, Bootstrap handles it behind the scenes. The only requirement we have to focus is that, we should have data-bs-toggle="dropdown" and inside that, we should have ul tag with class of "dropdown-menu"

[@CyberDudeNetworks]

Feel free to tinker around. Bootstrap helps us in most common scenarios.

[@balavigneshs3724]

Thank you sir.

[@origin309]

Super bro 👌👌 , Waiting for next video

[@harish12ff99]

bro boostrap 5 version use panran but navbar work avala bro plz reply

[@CyberDudeNetworks]

Kindly check this video: kzbin.info/www/bejne/h5W3hH2AhLmVpsk

[@priyav5969]

Brother I have one doubt... How to give navbar in second line My frst line consists of some set of nav bar. But I want my second line to have some set of new nav bars. How to do it?

[@priyav5969]

How to do it plz tell me

[@CyberDudeNetworks]

You mean navbars like home, contact links? I can't understand clearly. Can you ask your doubt clearly with rough drawings. Do that we can understand your query. Post it on facebook or telegram.

[@priyav5969]

@@CyberDudeNetworks Bro my primary navbar contains like home, contact. My secondary navbar tab contains like help, blog so how to give secondary navbar tab

[@CyberDudeNetworks]

You mean you want your secondary navbar below the primary navbar?

[@rinupaskaran6843]

Hi, Thanks for your videos. All are very useful. i tried this but toggle button is not working for me. I have updated all those things but still it is not working for me.. Please help me to solve this

[@CyberDudeNetworks]

Check in your browser console, it will show the error.

[@rinupaskaran6843]

@@CyberDudeNetworks there is no error and fontawesome icons also not working. It was showing square instead of icon. (i am using Bootstrap Version 5) Please guide me..

[@CyberDudeNetworks]

If it showing square instead of icons, then you have problem in referencing that icon. (Thapa link pani irupinga, kindly redo once again). If you still face the problem, share your code with us, on the facebook group. :)

[@kaviyarasus9344]

Bro enaku ml-auto work aagala

[@CyberDudeNetworks]

If you are using Bootstrap 5, you need ot use ms-auto instead of ml-auto. Check this: kzbin.info/www/bejne/h5W3hH2AhLmVpsk

[@kaviyarasus9344]

@@CyberDudeNetworks Got it

[@lifeofgames3089]

Bro active mattum work aagala bro other than active everything is worked perfectly bro

[@suseeIndran]

Check your jquery script tag inside body, try giving only the min version.

[@lifeofgames3089]

@@suseeIndran ok bro thq so much

[@VijayVijay-rj7wz]

13:54 home , about right side and button click work agala bro

[@CyberDudeNetworks]

Bootstrap 5 is out and you have to modify it like: ms-auto

[@goushikak3259]

Thalaiva vera level 💥

[@maskoothfarook3181]

Osam bro clear 💯💯

[@CyberDudeNetworks]

:)

[@dineshrajendran9593]

Bro, how to refer id in .js file in visual studio code. You are using id in html file ,how to do in .js file?

[@AbdulRahman-bq9yz]

Then ennoda laptop windows 7, 64 bit than. VS code install panniyum athu open aahave illa. y bro? naa sublime la than coding pannikitu iruken

[@prakashaathi556]

same code try pana bro ... but small screen la toggle pana killa iruku menus kamikalaa brooo? id # potu change panitaa ana show panala bro

[@lakshmanking823]

same problem

[@54vishnu55]

Button use Pani eapdi bro navbar ha switch panuradhu

[@ramu6928]

Super bro... Great explanation..👌👌

[@CyberDudeNetworks]

Thank you so much 🙂

[@workhardchamp1467]

Bro how to change collapsed menu colour in the mobile view bro? Only the collapse menu colour and not the header colour bro. Konjam guide pannunga bro

[@CyberDudeNetworks]

Write your css code in your mobile breakpoints. If you have doubts, watch this video: kzbin.info/www/bejne/iYTIfXR5lshoj8U

[@workhardchamp1467]

Thank you bro.. I will watch and get to you if i have any doubts.🙏

[@kamesha5973]

Very nice and friendly explanation ...but Anna is there any constraint that jquery must be used before javascript? coz in mobile view the dropdown is not working unless i place jquery above javascript

[@naveensarathy3632]

same time dropdown um work aagala bro ?

[@CyberDudeNetworks]

Please check this video: kzbin.info/www/bejne/h5W3hH2AhLmVpsk

[@vsathishkumar1890]

Brother enaku navbar button and drop-down wrk...la agala naa own ahh poten nd copy panniyum potu parthen brother cannot wrok 😟 what happened bro...? What's problem...? Slove bro plz

[@CyberDudeNetworks]

Have you included the javascript files? Correct ah link panni iruka paarunga.

[@vsathishkumar1890]

@@CyberDudeNetworks okay bro i will check tomorrow and any issue i have put cmt tq for response you busy schedule bro tq so much😍

[@CyberDudeNetworks]

@@vsathishkumar1890 No problem :)

[@meenambigav8651]

Nice explanation bro!!!

[@CyberDudeNetworks]

🤝

[@rubanraj8369]

Bro pottan ml potta right side move agalaye

[@CyberDudeNetworks]

If u are using Bootstrap 5, u have to use ms-auto instead of ml-auto

[@chinnapparajmotcham882]

@@CyberDudeNetworks bro ms-auto use pannalum work ahaka

[@CyberDudeNetworks]

@@chinnapparajmotcham882 You are using which bootstrap version?

[@chinnapparajmotcham882]

v5.1 bro@@CyberDudeNetworks

[@ramyas206]

Same doubt. Ms auto working

[@amalayakin4411]

bro navbar elements la spacing ah illama kaatuthu yen problem ah irukum nu nenaikiringa

[@ukvlog4613]

Codeplayla work aguthu but ...na editor la preview panrapoo varala

[@CyberDudeNetworks]

Check your code and if possible share your code with us, we will help you to solve the issue.

[@jagadeeshp5191]

Naa yennakku toggle button varala anga button irukku anaa anga yethum show agala

[@CyberDudeNetworks]

Make sure you include javascript.

[@jagadeeshp5191]

Anaa neenga onclick function maari yethume add pannave ila naa bootstrap la default function irukkunu nenacha

[@jagadeeshp5191]

Anaa ippo pannite

[@S.mariappanS.mariappan-ud5ki]

Bro ml= auto kudatha wrk agala why bro

[@CyberDudeNetworks]

Bootstrap 5 has some new changes. Browse in this channel, you will find that video.

[@jayasuryaraja1212]

ms-auto use pannuga bro work agagum

[@chammu6936]

Thanks for the effort bro. Please upload the video on responsive fixed nav bar and side bar

[@chayankumar_cj]

ml-auto work akuthilla why?

[@CyberDudeNetworks]

Bootstrap 5 was released now, please check this video: kzbin.info/www/bejne/h5W3hH2AhLmVpsk

[@akeelaameer9006]

Bro eppudi navbar background ah transparent ah mathuradhu ?

[@CyberDudeNetworks]

In Bootstrap 4+ navbar is transparent by default. Just don't mention the bg-colors. And it should work.

[@akeelaameer9006]

Thank you bro. And nan nav bar links ellm right align pannen but align aawdhilla bro nan ml-auto tan use pannen but right ku align aawudhilla

[@CyberDudeNetworks]

If you are using Bootstrap 5. Please watch our latest video on bootstrap.. In Bootstrap 5, we need to use ms-auto instead of ml-auto

[@ananthakumars6042]

Navbar is not working. Touch the navbar , it not drop down and nothing to show home,contact. So how to solve this. And one thing copy the full codes in bootstrap official page but it is not working.how to solve this?

[@CyberDudeNetworks]

Have you included the js files? Look on the video. We have explained that.

[@itzz_Shan_]

sema video broo

[@CyberDudeNetworks]

Thank you 😃

[@muneess2979]

super bro....

[@UnakenaNaan]

Bro enaku andha ml-auto work aagala Bro😒😒

[@CyberDudeNetworks]

If you are using Bootstrap 5, You have to use ms-auto (ms- margin start) Please check the latest migration video here: kzbin.info/www/bejne/h5W3hH2AhLmVpsk

[@UnakenaNaan]

@@CyberDudeNetworks How can I find which version am I using ?

[@student-jx2qt]

bootstrap version enna bro'

[@CyberDudeNetworks]

At the point of recording, it was bootstrap 4, we migrated that to bootstrap 5 in this video onwards: kzbin.info/www/bejne/h6nEgHaXds6aqMk

[@gopiultracamper2309]

Hello bro I'm first like command

[@justtry6020]

collapse not working bro

[@CyberDudeNetworks]

Have you included javascript scripts in your html file?

[@justtry6020]

@@CyberDudeNetworks bootstrap la erukka script ha add pannanum ha

[@CyberDudeNetworks]

Yes.

[@strbrother184]

Engaluku paste panni edit panna theriyatha bro 😒

[@CyberDudeNetworks]

Ipdi work aguthu nu theriyama, direct ah copy/paste pani edit pandrathala ena use? You will only get the output, but ithu maari navbar ipdi work aguthu nu, behind the scenes theriyathu la. Avangaluku kaga than, we are doing it from scratch.

[@anitham9365]

Wonderful explanation bro👍upload videos about hoisting

[@ukvlog4613]

ml-auto work agala

[@CyberDudeNetworks]

Are you using Bootstrap 5?

[@sahayabervin3653]

"#" kuduthan but home , about, content view aakala

[@CyberDudeNetworks]

Ena display agala?

[@sahayabervin3653]

@@CyberDudeNetworks Bootstrap bundle link pannunan vanthutu bro drop-down

[@Ranjithkumar-sh6nf]

plugin name

[@CyberDudeNetworks]

Which plugin? Be specific!

[@sanjayms7956]

Bro toggle button mattum invisible ah iruku...but click panna work avudhu.. But invisible ah mattum iruku.. Epdi visible panradhu??

[@CyberDudeNetworks]

Check all your codes. Video clear ah parunga. if you still not figured it out means, video description la github code potrukom. athula check panikonga!

[@mapaarchitects1266]

line 22 : target spelling error

[@CyberDudeNetworks]

If you installed bootstrap recently, kindly watch this video: kzbin.info/www/bejne/h5W3hH2AhLmVpsk

[@sakthivenkatesh1325]

Bro ml-auto nu pota wrk agala bro yen!?

[@CyberDudeNetworks]

You will be using Bootstrap 5, so try this ms-auto instead of ml-auto

[@nivaskumar4376]

Bro na test pannitea..! enaku (ML-auto) and drop-down Mattum work agamatengu Thu... ! Enna problem ? Nu sollunga

[@CyberDudeNetworks]

You might be using Bootstrap 5, If that so, kindly watch this video: kzbin.info/www/bejne/h5W3hH2AhLmVpsk

[@manikandanm8245]

@@CyberDudeNetworks Thank u bro ..

[@NBDevTechZone]

You can use ms-auto instead of using ml- auto (Bootstrap 5 ).

[@ACUCSPRADEEPB-up9ne]

@@NBDevTechZone thank u

[@ACUCSPRADEEPB-up9ne]

@@NBDevTechZone yeah ms-auto is working 👍

[@ukvlog4613]

ml-auto work agala

[@CyberDudeNetworks]

If you are using Bootstrap 5, then you have to use ms-auto instead of ml-auto :) Happy learning.

[@unknownkomali9739]

@@CyberDudeNetworks bro for right margin yena poduradu