css li content displays wrong characters in UTF-8 -


i trying create style display arrow on place of li element.

$("html > head").append("<style id=styles>div#panel { position: absolute; border-radius: 3px; font-family:'arial black'; font-size:13px; }\n\r" +      "ul li:before { content: \"\00bb \8680\"; }"     + "</style>\n\r"); 

what see mishmash characters not arrow. page charset utf-8.

i read this: http://www.artishock.net/coding/css-list-styling-using-ascii-special-characters/ http://www.w3schools.com/charsets/ref_utf_arrows.asp

how fix it?

try this. replace content: \"\00bb content: '\\00bb'.

working example:

$(function() {    $("html > head").append("<style>div#panel{ position: absolute; border-radius: 3px; font-family:'arial black'; font-size:13px; } ul { list-style: none; } ul li:before{ content: '\\00bb'; margin-right: 10px; } </style>");  });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>  <ul>    <li>some text</li>    <li>some text</li>    <li>some text</li>    <li>some text</li>  </ul>


Comments

Popular posts from this blog

magento2 - Magento 2 admin grid add filter to collection -

Android volley - avoid multiple requests of the same kind to the server? -

Combining PHP Registration and Login into one class with multiple functions in one PHP file -