CODEWITHSUNDEEP
htmlcss
Abder KRIMA
Abder KRIMA

Reputation: 3678

Why the css property "important" is not working?

This is my css element:

html, body, div, ul, ol, li, dl, dt, dd, h1, h2, h3, h4, h5, h6, pre, form, p, blockquote, fieldset, input, abbr, article, aside, command, details, figcaption, figure, footer, header, hgroup, mark, meter, nav, output, progress, section, summary, time, #ariane, #ariane1, #ariane2 {
  margin: 0px;
  padding: 0px;
  border: 0px none;
  outline: 0px none;
  font-size: 100%;
  vertical-align: baseline;
  list-style-type: none;
}
<ul style="list-style-type:decimal!important;">
  <li>test1</li>
  <li>test2</li>
  <li>test3</li>
</ul>

The problem:

The style of the element is applied instead of list-style-type:decimal!important; in spite of i put the property "!Important;"

When i inspect the element ul i find that the property list-style-type: none; is underlined and is checked but list-style-type: decimal !important; is just checked , but that is normal because of !important.

So why the numbers are not desplayed nor any think else? and why the numbers are displayed just when i unchecked list-style-type: none;?

Upvotes: 0

Views: 118

Answers (1)

John Fable
John Fable

Reputation: 1091

Your initial CSS is applying the list-style-type to both the UL and the LI, the over-ride is only applying to the UL. So the LI's remain set to the initial rule set in your CSS.

Upvotes: 7

Related Questions