Stack Overflow is a community of 4.7 million programmers, just like you, helping each other.

Join them; it only takes a minute:

Sign up
Join the Stack Overflow community to:
  1. Ask programming questions
  2. Answer and help your peers
  3. Get recognized for your expertise

I use react-bootstrap, but I want to modify some of the elements, so I wrote my own custom.css. However it doesn't make any changes (only when I put !important, but the file is so large so it's not a good option).

import {MenuItem, Nav, Navbar, NavBrand, NavDropdown, NavItem} from "react-bootstrap";
import {LinkContainer, MenuItemLink} from "react-router-bootstrap";
import '../assets/css/custom.css';

This is what I did so far.

share|improve this question
1  
First of all make sure you're loading your custom.css after that react plugins CSS and also use proper selector , of doing these you won't have to use !important. – vivekkupadhyay Oct 9 '15 at 12:29
    
@vivekkupadhyay what do you mean by after? i import in the following order. – kreadteff Oct 9 '15 at 12:56
    
then may be its selector issue – vivekkupadhyay Oct 9 '15 at 13:01
    
@vivekkupadhyay but i am also modifying classes, .navbar i.e – kreadteff Oct 9 '15 at 13:03

you can use sass or less(sass-loader, less-loader in webpack), or use .css in project

for example

│  data.js
│  index.css
│  index.html
│  index.js

here index.css likes your custom.css

you should add custom.css in index.html file

for example

<link rel="stylesheet" href="http://xxx/cdn/bootstrap.css">
<link rel="stylesheet" href="custom.css">

yeah, it looks like simple! just that!

share|improve this answer

When are you importing the Bootstrap CSS? I have an app which successfully uses Bootstrap with some overrides, which does this at the top of its index.js:

require('bootstrap/dist/css/bootstrap.min.css')
require('./bootstrap-overrides.css')
share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.