con una dimensión de texto en tamaño para ajustarse al contenedor

Question

El uso de CSS, y en concreto sin javascript onload, ¿sería posible hacer esto:

Tienes una celda de 150 píxeles de ancho y 100 píxeles de altura. Contiene un texto, por ejemplo: $ 20,00 o cualquier variante de eso.

Desea que se ajuste perfectamente al tamaño del contenedor.

Sería capaz de hacerlo con javascript, medir el tamaño del texto hasta que un contenedor sin margen/margen llegue al ancho y/o alto de la celda. O incluirlo en algo que tiene un desbordamiento establecido en automático y ver cuando se desborda o algo así.

¿Se puede hacer con CSS puro?

Tenga en cuenta que la fuente no es una fuente de tamaño fijo, tampoco. Usa Arial si quieres.

Answer 1

Una cosa que he hecho eso no es perfecto, pero puede hacer el trabajo en algunos casos es usar una regla @media para tamaños de pantalla más pequeños que X píxeles, establezca el tamaño de fuente más pequeño o más grande.

h2{ 
    font-size:25px 
} 

@media screen and (max-width: 850px){/* for screens smaller then 850px, set the font size smaller */ 
    h2{ 
    font-size:19px; 
    } 
} 

Por supuesto, esto sólo funcionaría suponiendo que el tamaño de los textos de contenedores se basa en el tamaño de la ventana de alguna manera.

Answer 2

mira esto: http://css-tricks.com/viewport-sized-typography/

Desafortunadamente esto sólo funciona en Chrome 20+ 10+ & IE así que por ahora tendrá que seguir con a js solution ....