2

Is there any possible way to make injected html use only my own written css without making all lines !important? because some html parts inherit style from existing website css file.

Nikas Žalias
  • 1,594
  • 1
  • 23
  • 51
  • If your question is "can I apply different CSS to different parts of the page, the answer is 'no' (see [here](http://stackoverflow.com/questions/3298746/apply-different-css-stylesheet-for-different-parts-of-the-same-web-page)), you must use specificity rules (see [here](http://stackoverflow.com/a/25105841/4682556)). – Dan May 05 '16 at 14:23

2 Answers2

1

Try using more specificity to add weight to the CSS you are declaring. For example, if your injected HTML has a class for the first parent it could be: .injected .things. Do note that ID's have more weight over class. https://developer.mozilla.org/en-US/docs/Web/CSS/Specificity

rawnewdlz
  • 1,221
  • 1
  • 17
  • 24
-1

You can try this:

Keep your (css file) at the bottom of all other (css files)

in this case you don't need to put important in your style.css file

like this:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<title>Index</title>
<link href="css/bootstrap.css" rel="stylesheet">
<link href="css/bootstrap-theme.css" rel="stylesheet">
<link href="css/style.css" rel="stylesheet">

Please see attached image: enter image description here

Asim Iqbal
  • 148
  • 1
  • 7