gwt - My CSS are overridden by Bootstrap CSS -


i want add gwt-bootstrap already-started project. managed use it, bootstrap css overriding every other css. result previous ui elements mixed up.

the margin, text size, , lot of elements don't fit more. can't use bootstrap because rest of project unusable. progressive change bootstrap , keep old stuff is.

i have csss in priority order:

  • myapp
  • gwt
  • bootstrap

i tried order them in *.gwt.xml without success:

<stylesheet src="css/gwt-bootstrap.css" /> <stylesheet src="css/bootstrap.min.css" /> <stylesheet src="gwt/clean/clean.css" /> <stylesheet src="myapp.css" /> 

what can do?

the priority of using styles driven more complicated algorithms order on inclusion in html. css style chosen specific selection rule, inline rules considered more specific externally attached, selection id, class , @ end selection tag name. example, paragraph <p id="xyz" class="xyz"> red independently of order of rules:

.xyz {   color: blue; } #xyz {   color: red; } 

if there 2 rules same selection type, number matters. so, selection .xyz .abc "stronger" .qwerty.

if 2 rules have equivalent selection in terms of numbers in each category, then, in end order taken account...

you can force different order !important directive.

read more "css specificity" keywords.


Comments

Popular posts from this blog

javascript - Count length of each class -

What design pattern is this code in Javascript? -

hadoop - Restrict secondarynamenode to be installed and run on any other node in the cluster -