Italicize font the oposite direct?

[PicnicTutorials]

Some crazy way possible?

[PicnicTutorials]

Here is one option but that is no good for me http://www.myfonts.com/fonts/baselinefonts/rough-egyptienne/left-italic/

[Alen]

I’m pretty sure it’s impossible to do. And why would you want to? Give us some context. What are you trying to do exactly? Is it decorative piece or informative piece of text? Are you worried about readability and legibility?

If it’s a decorative piece maybe use Photoshop to mock up the right solution.

Here are some resources with similar question:
http://stackoverflow.com/questions/11976193/italicize-text-backward

[Mottie]

I just updated that [StackOverflow question with my answer](http://stackoverflow.com/a/15035402/145346)… basically I used the skew matrix from the [Mozilla docs](https://developer.mozilla.org/en-US/docs/CSS/transform#Live_examples) and ended up with [this demo](http://jsfiddle.net/Mottie/dRQaw/510/):

HTML

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque eu metus nisi.
Integer non adipiscing massa. Etiam et diam magna. Mauris sit amet arcu dui, a
malesuada erat.

jQuery

// html function requires jQuery 1.4+
$(‘#skewed’).html(function (i, h) {
h = h.replace(/s+/g, ‘u00a0’).split(”);
return ‘‘ + h.join(‘‘) + ‘‘;
});

CSS

#skewed {
font: 24px Georgia, sans-serif;
background: #ccc;
padding: 10px 20px;
}
#skewed span {
display: inline-block;
/* see https://developer.mozilla.org/en-US/docs/CSS/transform */
-webkit-transform: matrix(1, 0, 0.6, 1, 8, 0);
-o-transform: matrix(1, 0, 0.6, 1, 8, 0);
transform: matrix(1, 0, 0.6, 1, 8, 0);
}

[PicnicTutorials]

Hey good job! That is actually quite usable. Take care. :)

[Alen]

Nice one @Mottie.

[Mottie]

Hmm, actually it would be easier to use and control by using skewx instead ([updated demo](http://jsfiddle.net/Mottie/dRQaw/511/)):

#skewed span {
display: inline-block;
/* see https://developer.mozilla.org/en-US/docs/CSS/transform */
-webkit-transform: skewx(20deg);
-o-transform: skewx(20deg);
transform: skewx(20deg);
}

[cnwtx]

This is where nth-line(n) would be really useful!

[chrisburton]

This severely effects legibility. Why would you want to do this? By the way, you’re looking for an opposite of oblique, not italic.

[dfogge]

please don’t do these horrible things to innocent typefaces.

[PicnicTutorials]

Better question is why do you guys care what I do with one word on my site? Now you’ll say – “oh it’s only one word – ok then then”. Still why do you care what I do with my site?

I’m sorry this just carries over to from things in my life that I experience and see. I can’t stand it when people have nothing better to do than stick their nose in my bussiness. To those people I say – you run YOUR life the way you want and I’ll run MINE the way I want. That includes everything from taking a shit upside down (god forbid) to italisizing text the oposite direction. If its not directly affecting you you should not care.

[dfogge]

hey you do you, buddy. i just feel that typography matters more than most design choices, especially on a site where you expect users to, ya know, read.

that being said, you’re right that doing things like this to a single word probably won’t effect much.

[Kitty Giraudel]

You shouldn’t do this. It’s counter intuitive and visually unappealing.

[cnwtx]

Before y’all tar and feather him, I just used this exact thing to un-italicize a cursive font that was naturally tilted. It’s still perfectly readable.

[chrisburton]

@cnwtx Majority of script faces are slanted. You could have just found an upright script. By the way, no one is ridiculing him, we are giving advice.

@websitecodetutorials Why do you come here if you’re just going to explode at those who give you relevant and professional advice? Also, you invited us into “your business” when you asked a question on this forum. What is clear to me is that even though it is your site, you don’t care about UX, which is obviously important for the type of site you’re running. Good luck with it.

[Author]

Posts