CODEWITHSUNDEEP
htmlcss
tjons
tjons

Reputation: 4769

Multiple CSS Styles on the same page

Picture this scenario:

I have 2 stylesheets. One is a global stylesheet. The other is a page-specific style. They each modify the class .tobestyled, but in different ways, i.e., the global says to make the class hidden, while the page-specific says to make it shown.

How can I make the styling in the page-specific stylesheet override the global one?

Upvotes: 0

Views: 248

Answers (1)

Alejandro Iván
Alejandro Iván

Reputation: 4051

Import the page-specific stylesheet after the global one, that should do it.

<link rel="stylesheet" media="screen" href="global.css" />
<link rel="stylesheet" media="screen" href="page-specific.css" />

If, for some reason, the styles are not replaced correctly, add an !important clause after the line you want to force, for example:

.tobestyled {
    background-color: white !important;
}

Upvotes: 1

Related Questions