[SOLUCIONADO] Anchura bloque de texto sin tocar fondo

[fidelio]

Hola,

A ver si alguien me puede ayudar con este tema.

Tengo un CSS con el siguiente estilo:

Código HTML:

.preview_text {
	background-image: url('http://ruta de imagen.png');
	width: 300px;
	height: 78px;
	font-style: italic;
	font-size: 14px;
	text-align: center;
	overflow: hidden;
	line-height: 14px;
	display: block;
	padding-top: -2.2em;
	font-family: 'Asap', sans-serif;
	
}

En este bloque hay un texto que se adapta al ancho, evidentemente, pero querría que la caja del texto fuera algo más estrecha, pero que el fondo no se resintiera, ya que si aquí todo el "width" el fondo se me estrecha también.

Para más información, el texto que aparece en la caja, es una llama "meta" de un campo personalizado, por si fuera de ayuda.

He probado con el padding, pero igualmente me aumenta la imagen de fondo.

Muchas gracias.

[pzin]

Usa padding con el valor que necesites pero añádele también box-sizing: border-box.

La otra opción es meter el texto de otro elemento.

[fidelio]

Muchas gracias por la respuesta, ha funcionado perfectamente.