Bootstrap 4 Transparent Navbar Creation 👈

[@System22]

Watch Next: kzbin.info/www/bejne/Y4aofoqAn6eLrdk Suggested Playlist: kzbin.info/www/bejne/hqi4qGWhnNOeotU Sub: kzbin.info/door/Yeyetu9B2QYrHAjJ5umN1Q

[@omaryahia]

answer is at 6:47 if the navbar class is bg-dark use css to make its background transparent like this : .bg-dark { background-color: transparent !important; } !important is used to force the style and override the original one

[@snapsmicrosystems7532]

you are a here

[@kristiyanivanov7414]

you are a here

[@holomode1357]

It didnt't work. The nav bar still dark :( EDIT: It doesn't work with bootstrap4, but with bootstrap3

[@System22]

Not sure why that is Omar Yehia - Check out our playlist page for more videos on this: kzbin.infoplaylists - Please like, share and subscribe if you have not done so already - Thanks!

[@maksimsburaks6973]

You could also neglect any bg attribute, for one of my projects I done this. What I did was implement some jquery(or JS) to add classes to the nav bar on scroll turning the navbar dark after a certain amount of pixels was scrolled down, and then revert to clear once you're back to the top (nav bar was set to fixed also)

[@System22]

Nice! @maksimsburaks6973 - Check out our playlist page for more videos on this: kzbin.infoplaylists - Please like, share and subscribe if you have not done so already - Thanks!

[@andersonjoelparrarocha9382]

OMG!!!! Very nice you tutorial, new subscribe

[@System22]

Thanks and welcome

[@nickrivers-jo1th]

Great video man really helped

[@System22]

Glad to help nick rivers - Please like, share and subscribe if you have not done so already - Thanks!

[@BrianEller-begrafx]

Rather than forcing the BG-DARK to be transparent, based on your update, with the !important tag, I believe you can simply change your HTML from BG-DARK to BG-TRANSPARENT.

[@BrianEller-begrafx]

Just change line 66 of your HTML, where it says "BG-DARK", change it to say "BG-TRANSPARENT"

[@System22]

Yes, that is correct, there are always many different ways of doing things. Do whatever works for you!

[@ridz4912]

Worked for me Mate, Thank you ! :)

[@camilinbajista]

this video really helps me. Thank you!

[@System22]

Glad to help - Please like, share and subscribe if you have not done so already - Thanks!

[@NicolasSilvaVasault]

how do this in a reactstrap environment? with react components is really hard to stylize there since components like Navbar are not actually css classes

[@System22]

I'll look into it when I can Nicolas Silva A. - Check out our playlist page for more videos on this: kzbin.infoplaylists - Please like, share and subscribe if you have not done so already - Thanks!

[@NicolasSilvaVasault]

@@System22 bro that was 3 years old answer to my question, i'm already a react native and react senior developer, but thanks for checking out

[@francismartin5528]

next time when your making a video like this, please start from the beginning rather than start when you already have some content, makes it hard to follow

[@System22]

Probably part of a series, here's the playlist: kzbin.info/aero/PLqabIl8dx2wp23CY5SjXJNfYoJMeSgZee Or here's a complete video: Part 1 kzbin.info/www/bejne/Y4aofoqAn6eLrdk Part 2: kzbin.info/www/bejne/nKO1qnSir51lhc0 All of my playlists here: kzbin.info/door/Yeyetu9B2QYrHAjJ5umN1Qplaylists

[@jonayethossain6672]

Thank you Sir

[@System22]

Glad to help - Please like and subscribe if you have not done so already - Thanks!

[@bakg8979]

this wont work with a static top navbar

[@System22]

Sure it will bakg8 - Please like, share and subscribe if you have not done so already - Thanks!

[@sabitislamshanto6269]

It does not work on my file.

[@System22]

Make sure you are using the !important after your color code to overwrite the default bootstrap code LeGendBoy11 - example - background:transparent !important; - Please like, share and subscribe if you have not done so already - Thanks!

[@bakg8979]

if fixed-top is not in the class it wont work

[@System22]

I'll look into it when I can bakg8 - Check out our playlist page for more videos on this: kzbin.infoplaylists - Please like, share and subscribe if you have not done so already - Thanks!

[@anikethirpara]

closed the video after he opened editor without zooming IN

[@System22]

I'll look into it when I can Aniket Hirpara - Check out our playlist page for more videos on this: kzbin.infoplaylists - Please like, share and subscribe if you have not done so already - Thanks!