Question

Is it possible to change inline element order using only css?

Like we have this:

<span class="opening_quote">“</span>
<span class="text">Lorem ipsum...</span>
<span class="closing_quote">”</span>

• Text will be multi-line.
• Code should support ie6+ so :after and :before we can’t use.

But for rtl direction we should change order of quotes and text:

“Lorem ipsum dolor sit amet, consectetur 
adipiscing elit”

to

Lorem ipsum dolor sit amet, consectetur”
                        “adipiscing elit

Thanks.

Answer 1

You need to create the following structure:

<span class="text">Lorem ipsum...</span>
<span class="opening_quote">“</span>
<span class="closing_quote">”</span>

And add absolute to quotes depends on the direction.