/    Sign up×
Community /Pin to ProfileBookmark

Give priority to a CSS file

Copy linkTweet thisAlerts:
Dec 04.2017

Dear users,

I have a HTML page like this:

[code=html]<link rel=”stylesheet” type=”text/css” href=”styles.css”>
<link rel=”stylesheet” type=”text/css” href=”themes.css”>[/code]

Now I want all the statements written in themes.css must overwrite the statements in styles.css

I don’t want to use !important every statement in themes.css

Is there a fast way?

Thanks

to post a comment
CSS

7 Comments(s) ↴

Copy linkTweet thisAlerts:
@rootDec 04.2017 — Then swap them around... pages load in the order in which the statements are encountered and whats more, if you already have a style sheet set a page up, what the point of over writing the styles? Just load up the styles you want and no messing around wasting peoples data allowances and bandwidth.
Copy linkTweet thisAlerts:
@redagrauthorDec 05.2017 — So, in the example I have written themes.css, but it is a dynamic CSS generated by php and mysql, so it will be "user.php?what=his_style".

Then there is a general CSS for all users, but there is also a specific CSS for the user (not all users), and I need to overwrite the general styles with the user's style.

So, we return from the begin.

How can I do?
Copy linkTweet thisAlerts:
@rootDec 05.2017 — If you have a user account who has been allowed their own page theme, then you would store that information in a database as a CSS string that you write in with PHP to the page rather than wasting time loading a theme to be written over immediately, I assume the person has to login to their account, thats how you would then serve up their theme.
Copy linkTweet thisAlerts:
@redagrauthorDec 05.2017 — I didn't understand very well what you written, but I want to know if I can do what I asked in first post.

Or if there is a similar fix, I don't want to edit PHP files.


Thanks
Copy linkTweet thisAlerts:
@SempervivumDec 05.2017 — There are several rules for the priority of CSS properties. Most important:

1. The last assignment will overwrite all previous ones, i. e. assignments in your second file will overwrite those in the first file.

However

2. Assignments on a selector being more specific will override assignments on a selector being less specific, i. e.

div.theclass{background-color: red} will override div{background-color:white}.

If div.theclass{background-color:white} is defined in your first file it will have priority and will not be overridden by div{background-color:white} in the second file.
Copy linkTweet thisAlerts:
@redagrauthorDec 06.2017 — Yes, I know.

I read this document: https://www.w3.org/wiki/CSS/Training/Priority_level_of_selector

Unfortunately, in the second file (themes.css) I defined the selectors in order to have a priority level lower than the first file (styles.css), and I can't change them for different reasons.

So when I see the window inspector, I can see the "themes.css" rules overwritten by "styles.css" rules.

This is the problem.

I want the "themes.css" will overwrite "styles.css" without writing !important at all the statements in themes.css


Is there a solution?

Thanks
Copy linkTweet thisAlerts:
@SempervivumDec 06.2017 — I don't know any solution for this problem. The only solution I know about is deactivating the complete styles.css file. However this would require defining all rules completely in the second file again instead of overwriting a few.
×

Success!

Help @redagr spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 6.17,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @nearjob,
tipped: article
amount: 1000 SATS,

tipper: @meenaratha,
tipped: article
amount: 1000 SATS,

tipper: @meenaratha,
tipped: article
amount: 1000 SATS,
)...