2

I'm getting the following (Notice the quotation marks and "..." on the wrong side) :

enter image description here

What I want is "This is a very very very long comment..."

This is the HTML Code (I'm using angularjs but it doesn't work even without it):

<span class="comment ng-binding">"This is a very very very long comment..."</span>

This is the css for comment:

ul#comment-list .comment-comment .comment {
   color:#000;
   display:block;
   text-align:left
}

I've checked all the settings in Chrome developer tools to make sure some stray css rule isn't messing everything up, but there's nothing wrong there, no matter what css rule I disable.

sinθ
  • 11,093
  • 25
  • 85
  • 121
  • 2
    It's hard to tell what's going on without seeing what ng-binding does in CSS or javascript. I think it may be adding the quote marks for you - if so, your quote marks in the span will mess it up. Try with no quote marks in the span and see what happens. – Deborah Jan 08 '14 at 22:06
  • It seems to work: http://jsfiddle.net/nd9Tj/ – Cilan Jan 08 '14 at 22:08
  • 3
    I [can't reproduce](http://jsfiddle.net/m2ej6/), something must be missing from your test case. – Quentin Jan 08 '14 at 22:08
  • @DeborahSpeece Sorry, I should have mentioned for those unfamiliar. `ng-binding` is just a class `angularjs` uses to keep track of elements. It has no css rules. – sinθ Jan 08 '14 at 22:10
  • 1
    [Are you hiding `direction:rtl;` from us?](http://jsfiddle.net/m2ej6/1/) Inspect the rules on that element to see if that gets applied. – Trojan Jan 08 '14 at 22:14
  • @trojansdestroy ...oh. Thanks so much! I completely forgot that I had that on my `ul` in order to get the scroll bar on the right side. I didn't know that it also changed punctuation. – sinθ Jan 08 '14 at 22:17

3 Answers3

5

You must have direction:rtl; applied to your comment element. As stated here, with direction:

ltr: The initial value of direction (that is, if not otherwise specified). Text and other elements go from left to right.

rtl: Text and other elements go from right to left

Why, then, is the text not backwards, letter-for-letter?

For the direction property to have any effect on inline-level elements, the unicode-bidi property's value must be embed or override. (seems not to be true in testing)

You must use a Unicode control character, as described here. And here's a demo; note that only the punctuation is flipped on the second output line, but everything is flipped on the third line (with the control character).

Community
  • 1
  • 1
Trojan
  • 2,256
  • 28
  • 40
-3

The quotation symbol (i.e. ") is reserved in HTML. Replace it with

&quot;
Cilan
  • 13,101
  • 3
  • 34
  • 51
mcsilvio
  • 1,098
  • 1
  • 11
  • 20
-3

Instead of using double quotes try using &ldquo; and &rdquo; for left and right double quotes. Refer this.

user2989408
  • 3,127
  • 1
  • 17
  • 15