Bug 1080828 - [Messages][RTL] International phone numbers and groupmms threads are not correctly displayed. r=julien

Sorry will try to explain with example, imaging that we have smth like this:
```
<div>
  <p>+1234567</p>
  <p>Additional localized data</p>
</div>
<div>
  <p>عبد الحميد</p>
  <p>Additional localized data</p>
</div>
```
In LTR both names/numbers and additional data text are left aligned, ```p``` is block element with ```direction=ltr;``` (inherited from parent) and it's widh is 100%.

In RTL everything is right aligned, but phone number is displayed like ```1234567+```. Ideally I'd like to set ```dir=auto``` for the ```p``` element since it contains only text we need to fix. ```dir=auto``` on the first ```p``` will make it left aligned, but since its width is 100% we'll have something like this:
```
+1234567
            Additional localized data
-------------------------------------
                          عبد الحميد
            Additional localized data
````

So I see only two solutions here, either use nested ```bdi``` (that is simplier and less risky) or make ```p``` to have width that is equal to its content (via display: inline or max-width or anything else). With the latter option we'll have to make some css changes