CODEWITHSUNDEEP
htmlcsstwitter-bootstrap
Selva
Selva

Reputation: 1670

css not affecting the page when using with bootstrap

I am a newbie to bootstrap. I have developed a weppage using bootstrap3. I'm using these two classes on the same element, but the css is not having any effect:

HTML:

<div class="col-md-4 auminascroll">
    dfgdgdfgdfgsdfgh cxzvdzfhfdbfd fbfddf
</div>
<div class="col-md-4 auminascroll">fghfdghfdhdfhfdsh</div>
<div class="col-md-4 auminascroll">dfgdsgdsfg</div>

Css:

.col-md-4 .auminascroll {

   height: 50px;
   overflow-y: auto; 

}

I am not getting a scroll when using above code. If I put height: 50px; overflow-y: auto; in a style tag, my code works fine. Why is this css not having an effect when using it with this bootstrap class? Is there any problem with my code?

Any help will be greatly appreciated!!!

Upvotes: 1

Views: 635

Answers (2)

Mahesh Thumar
Mahesh Thumar

Reputation: 4395

You are using the wrong css selector. You need to use it like: 

.col-md-4.auminascroll {

  height: 50px;
  overflow-y: auto; 

}

Upvotes: 2

M1ke
M1ke

Reputation: 6406

You're nearly there! When using a selector to choose two classes there should be no space between the class names - they just need separating with a dot.

.col-md-4.auminascroll { /* no space between the two classes */

 height: 50px;
 overflow-y: auto; 

}

Your code (where there's a space between the two classes: .class-a .class-b would actually look for an element of class-b inside and element of class-a.

<div class="col-md-4">
    <div class="auminascroll">
    </div>
</div>

Upvotes: 5

Related Questions