CODEWITHSUNDEEP
css
user007
user007

Reputation: 3243

CSS code priority

I want to load a css code from a specific stylesheet first, Like:

ul, ol {
    margin: 0 0 10px 25px;
    padding: 0;
}

the above code is in two files: core.css and bootstrap.css

core.css load first in head tag.

But browser always use code first from bootstrap.css.

I tried to rename bootstrap.css to z-bootstrap.css. But no luck still browser apply styles from z-bootstrap.css It work when I edit ul, ol to body ul, body ol in core.css

But I dont want to do this, How to apply styles from core.css without adding any class or attribute.???

Upvotes: 1

Views: 113

Answers (4)

Stephen Reindl
Stephen Reindl

Reputation: 5819

The order of css application does not always depend on the include order, but on the level of specificity:

http://www.w3.org/TR/CSS21/cascade.html#specificity

Upvotes: 2

Flowen
Flowen

Reputation: 395

Try to put !important at the end

ul, ol {
margin: 0 0 10px 25px !important;
padding: 0 !important;

}

That will give priority

Upvotes: -3

Chris Bier
Chris Bier

Reputation: 14447

You need to load core.css after bootstrap.css in order for the rules in core to override bootstrap.

Upvotes: 1

karthikr
karthikr

Reputation: 99620

In your declaration, have core.css below/after bootstrap.css

example: 

<link rel="stylesheet" type="text/css" href="bootstrap.css">
<link rel="stylesheet" type="text/css" href="core.css">

Upvotes: 6

Related Questions