CODEWITHSUNDEEP
css
David Brierton
David Brierton

Reputation: 7397

Navbar logo link css

I am trying to make the "alt" text of the brand-logo and brand-logo-collapsed link white instead of the default blue like all the other ones. But am unable to figure out the proper css to specifically call that portion. Will someone please guide me in the correct direction.

<a href="#/" class="navbar-brand">
                  <div class="brand-logo">
                     <img src="#" alt="Dealer Tracking" class="img-responsive">           
                  </div>
                  <div class="brand-logo-collapsed">
                     <img src="#" alt="Dealer Tracking" class="img-responsive">   
                  </div>
               </a>

CSS

a > navbar-brand > img {
  color: #fff;
}

Upvotes: 0

Views: 141

Answers (2)

Farzin Kanzi
Farzin Kanzi

Reputation: 3435

You can do this:

.brand-logo > img, .brand-logo-collapsed img{
   color: white;
}

And if you want to to this for all of your images:

img{
   color: white;
}

Upvotes: 1

Hussein Duvigneau
Hussein Duvigneau

Reputation: 541

Your element with navbar-brand class is the same element as the anchor, so need to be treated as such in the CSS (be removing the space in between). Also classnames should be prepended with a ., and as you have a div in between the image and the anchor, it will break the rule, as > only selected direct descendants, so get rid of that:

a.navbar-brand img {
color: #fff;
}

Should get it working.

Upvotes: 2

Related Questions