Is it possible to integrate MaterializeCss into Bootstrap

css twitter-bootstrap web css-frameworks materialize
Nickolaus picture Nickolaus · Feb 19, 2015 · Viewed 40k times · Source

I have asked myself (not tested) if it is possible to integrate both bootstrap and materializecss into the same project

Since both frameworks are for the same purpose and probably overlapping in some class definitions etc. is it still possible to combine both frameworks in order to expand my styling options?

Answer

Guillaume picture Guillaume · Feb 19, 2015

Materialize is not based on Bootstrap nor just a "visual layer", using both frameworks may lead to a lots of incompatibilities or at least overlap a lot as most of their functionalities are redundant (grids, menus, icons, etc).

I personally use this project Bootstrap material design which is a theme for Bootstrap and works very well. If you don't need/want Bootstrap you can also use Material Design Lite that has been recently released by Google. It is a light CSS framework based on Material Design guidelines. Light in comparison to Angular Material or Polymer also using Material Design guidelines but part of or requiring other javascript frameworks (i.e. Angular).

Related questions

Twitter Bootstrap Button Text Word Wrap

For the life of me I am unable to get these twitter bootstrap buttons to text wrap onto multiple lines, they appearing like so. I cannot post images, so this is what it is doing... [This is the bu] tton …

Read More
How to use the new affix plugin in twitter's bootstrap 2.1.0?

The bootstrap documentation on that topic is a little confusing to me. I want to achieve similar behaviour like in the docs with the affix navbar: The navbar is below a paragraph / page heading, and upon scrolling down it should …

Read More
Bootstrap Glyphicons not displaying in angular2

I am trying to use bootstrap glyphicons in my angular2 app. I have installed bootstrap using the command npm install bootstrap --save My code snippet is <button *ngIf="pos.name == uname" type="button" class="btn btn-default btn-sm delete" (click)="…

Read More