I would have expected something like this to work:
Code:
<html>
<head>
<style>
div { margin-left: 3em; }
span.hang-left { width: 0; display: inline-block; text-align: right; }
</style>
</head>
<body>
<div>
<span class="hang-left">"</span>I want this."<br/>
I want this.
</div>
</body>
</html>
The problem is you lose kerning after the quote. And then inline-block is not included in the current ePUB standard, and Opera at least does not right-align anyway.
An uglier solution is:
Code:
<html>
<head>
<style>
div { margin-left: 3em; }
span.phantom { visibility: hidden; }
</style>
</head>
<body>
<div>
"I want this."<br/>
<span class="phantom">"</span>I want this.
</div>
</body>
</html>
because you have to repeat the quotes every line, and the visibility property is not in the current ePUB either.
Now, this works (in Opera), I'm not sure why:
Code:
<html>
<head>
<style>
div { margin-left: 3em; }
span.hang-left { position: relative; }
span.hang-left span { position: absolute; right: 0; }
</style>
</head>
<body>
<div>
<span class="hang-left"><span>"</span></span>I want this."<br/>
I want this.
</div>
</body>
</html>