Question

This should be really simple, but I can't figure it out. So: how do I get these two characters to merge up in a table?

〳   1st row, U+3033 VERTICAL KANA REPEAT MARK UPPER HALF
〵   2nd row, U+3035 VERTICAL KANA REPEAT MARK LOWER HALF

Those are used in the vertical writing of Japanese, and they're supposed to look like a big version of U+3031 VERTICAL KANA REPEAT MARK 〱 when combined. But simply setting border-spacing, padding, collapse etc isn't enough, since there's still space above and below the chars themselves. Failed attempt:

<table style='border-collapse:collapse'>
  <tr><td>〳</td></tr>
  <tr><td>〵</td></tr>
</table>

So how do I squeeze the juice out of the text? I suppose the ideal answer would be to use 'real' vertical writing capabilities in a browser, but as far as I can tell this is still a utopian draft.

Was it helpful?

Solution

You need to also use border-spacing: 0;. That along with padding:0; will help. They should match, however, depending on the padding the actual font character has, you might have to use a div, and set the height/width so that it clips.

You might be better off with Div's, if you are simply trying to display the character.

http://www.gateshosting.com/test/slash.html

<div>
 <div style='border:0;padding:0;font-family:tahoma;font-size:15px;height:14px;'>/</div>
 <div style='border:0;padding:0;font-family:tahoma;font-size:15px;height:14px;''>\</div>
</div>

Surely there has to be a solution if you search for it on a Japanese blog or something.

OTHER TIPS

If you can wrap them in a span, then this works http://jsfiddle.net/zdqvM/5/ and the shift seems to be correct even at higher font-size: http://jsfiddle.net/zdqvM/6/.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top