Change background color of button in Twitter Bootstrap using CSS

0 Views

I am using the following pagination button styles provided by Twitter Bootstrap: 

<ul class="pager">
  <li class="previous"><a href="#">&larr; Older</a></li>
  <li class="next"><a href="#">Newer &rarr;</a></li>
</ul>

This is how they currently look like:

Read More

enter image description here

How do I need to change my CSS style to change the background color of these buttons from green to some other color?

I tried this CSS code, but it did not change the button styles: 

.next {
    background-color: #ecf0f1;
    color: #2d525d;
}

Thank you!

Post Views: 0

Related posts

Leave a Reply

3 comments

  1. You need to overwrite the css codes:

    .next a {
    background-color: #ecf0f1 !important;
    color: #2d525d !important;
}

    Edit: The color and background-color styles are for “a” element inside the li.

  3. Use 

    !important

    after you css but before ;

    It pretty much means ignore anything else and use THIS !important

    you will need to use this to break out of default styling in some frameworks, its also useful for media queries.