transform:scale замыливает шрифт - HTML и CSS

alex4321 · 05.11.2012, 01:37

В общем-то, суть проблемы отражена в заголовке. Есть страница, к 2 блокам которой применено это свойство. Но в результате размывается шрифт (если отключить его использование, то всё ОК - разумеется кроме уплытия размеров). Есть ли методы борьбы, кроме переделывания CSS так, чтобы transform: scale не было нужно?

MyLastHit · 05.11.2012, 01:53

Пробуй это.

Код:

-webkit-backface-visibility: hidden

или

Код:

-webkit-transform-style: preserve-3d;

У меня такая проблема была при Rotate блока. Грани слишком пикселизовались. Было только у хрома. Оказалось это специально сделано для быстрого рендера в браузере.

alex4321 · 05.11.2012, 03:03

transform-style пробовал, не помогало. А вот про первое - фиг знает, уже поправил и избавился от transofrm scale (интересно - как именно оно влияет? точнее каким образом.)
UPD. В моём случае проблема была в опере и вроде ещё FF

MyLastHit · 05.11.2012, 12:48

А если текст через svg выводить? Есть проблема? Там как раз и без scale можно обойтись. Внутренними механизмами svg.

alex4321 · 05.11.2012, 22:45

Если честно - есть 1 проблема - никогда не работал с svg и уже нет необходимости (решил проблему, поменяв размеры элементов - заодно "оптимизировал" таблицу)

05.11.2012, 01:37	#1
alex4321 Пользователь Регистрация: 23.07.2012 Сообщений: 77	transform:scale замыливает шрифт В общем-то, суть проблемы отражена в заголовке. Есть страница, к 2 блокам которой применено это свойство. Но в результате размывается шрифт (если отключить его использование, то всё ОК - разумеется кроме уплытия размеров). Есть ли методы борьбы, кроме переделывания CSS так, чтобы transform: scale не было нужно?

05.11.2012, 01:53	#2
MyLastHit Очень суровый Участник клуба Регистрация: 17.12.2009 Сообщений: 1,988	Пробуй это. Код: `-webkit-backface-visibility: hidden` или Код: `-webkit-transform-style: preserve-3d;` У меня такая проблема была при Rotate блока. Грани слишком пикселизовались. Было только у хрома. Оказалось это специально сделано для быстрого рендера в браузере. Ненавижу быть как все, но люблю, чтобы все были как я.

05.11.2012, 12:48	#4
MyLastHit Очень суровый Участник клуба Регистрация: 17.12.2009 Сообщений: 1,988	А если текст через svg выводить? Есть проблема? Там как раз и без scale можно обойтись. Внутренними механизмами svg. Ненавижу быть как все, но люблю, чтобы все были как я.

Похожие темы
Тема	Автор	Раздел	Ответов	Последнее сообщение
transform угол	Predator199	HTML и CSS	5	08.09.2012 13:34
построить texture direction/scale histogram	vilix	Помощь студентам	0	25.07.2012 05:44
Альтернатива Picture1.scale(x,y)-(x,y) для Visual Studio 2005 VB?	reset2	Помощь студентам	0	07.01.2012 15:34
std::transform вывести сумму двух векторов	kouphais	Общие вопросы C/C++	2	16.10.2011 22:04
как изменить css свойство transform из Js?	Даниил_глазко	JavaScript, Ajax	2	15.10.2011 13:23

05.11.2012, 03:03	#3
alex4321 Пользователь Регистрация: 23.07.2012 Сообщений: 77	transform-style пробовал, не помогало. А вот про первое - фиг знает, уже поправил и избавился от transofrm scale (интересно - как именно оно влияет? точнее каким образом.) UPD. В моём случае проблема была в опере и вроде ещё FF

05.11.2012, 22:45	#5
alex4321 Пользователь Регистрация: 23.07.2012 Сообщений: 77	Если честно - есть 1 проблема - никогда не работал с svg и уже нет необходимости (решил проблему, поменяв размеры элементов - заодно "оптимизировал" таблицу)