Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

CSS

nicholas maddren
nicholas maddren
12,793 Points

Apply Bootstrap CSS Customizations

Hello community, I am a little confused with Bootstrap at the moment.

So I have added changes to the Bootstrap CSS by creating a folder called style.css. I have changed some of Bootstraps default CSS, here is an example:

.navbar-nav > li:last-child{
    border-right: 1px solid #475d88;
}

That uses Bootstrap classes to change the nav.

If I now use these classes to create another navbar on the page I will be left with the changes from my other navbar. How can I make multiple changes without affecting other elements?

Thanks

1 Answer

An easy workaround to this problem, and others like it, is to create a class just for the element you want to select.

For example is this is the navigation at the top of page creating a .navtop class for specific stylings to that element.