HTML CSS Styling for Hebrew Niqqud

Question

I would like to style niqqud characters inside html differently than letter. Suppose I would like to have a letter in English, and Dagesh in it is green.

How can this be done in html + css?

This does not do the task:

<div style = "font-size: 500%">
    <span style = "color: black">&#1489;</span><span style = "color: red">&#1468;</span>
</div>

Run codeHide result

The result is: http://jsfiddle.net/nv7ja459 (link with a large font: http://jsfiddle.net/nv7ja459/1/ )

So dagesh is no longer inside the letter.

Link to the screenshot https://drive.google.com/file/d/0B4SYIrNV4hXYZ0ZyWXZnZWg4OGc/view?usp=sharing

Answer 1

, , . , Win 7 Firefox dagesh , Chrome IE dagesh, .

, . , , . ( ) , , , . ; , , .

, .

, , ( ), ( dagesh), , - . : , ( ). , , heres :

<style>
.colcomb { position: relative }
.colcomb  .base { position: absolute; left: 0; top: 0; z-index: 100; }
.colcomb .combined { color: red; }
</style>
<div style = "font-size: 500%">
<span class="colcomb">
     <span class="base">&#1489;</span>
     <span class="combined">&#1489;&#1468;</span>
</span>
</div>

Hide result

Answer 2

:

<font color='green' size='12'>&#1468;</font><font color='black' size='12'>&#1489;</font>

firefox, ,

12, ,

http://i.imgur.com/smkx3MN.png - ,