text-align justify not working

Estoy tratando de justificar el texto dentro de esta etiqueta p para que se ajuste perfectamente al ancho de la p.text-align justify not working

<p align="justify" style="text-align: justify !important; color:#fff; margin:0px; font-weight:bold; width:487px; border:Solid 1px red;">blah blah blah</p>

pero el texto simplemente no justificará! alguna idea por que?

gracias por cualquier ayuda.

Fuente

2011-06-03 phil

Si su texto no abarca más de una línea, la justificación no hace nada. Su texto debe pasar a la siguiente línea, y luego la primera línea estará justificada, pero no la segunda.

Fuente

2011-06-03 14:30:01 Brett

maldito. entonces no hay manera de css de justificar 4 palabras en un ancho de 487 p? – phil

@phil - no es que yo sepa de ... – Brett

es correcto. También necesitó cambiar el 'color' de blanco sobre un fondo blanco para ver esto. http://jsfiddle.net/5RpQr/ –

Si quiere justificar cuatro palabras en 487px puede intentar usando word-spacing en su css.

He usado word-spacing:8em; para bla bla bla bla pero puede ajustarlo según sea necesario.

http://jsfiddle.net/5RpQr/1/

Fuente

2011-06-03 14:38:03

@phil - Solo recuerda que si cambias tus palabras, el espaciado de palabras también debe cambiar – Brett

@Brett. –

Puede utilizar la solución descrita aquí: http://blog.vjeux.com/2011/css/css-one-line-justify.html

Esto se justifica una sola línea, pero añade un espacio después, por lo que si se conoce la altura, se puede especificar con overflow:hidden para ocultar y aún obtener la justificación.

<!-- HTML --> 
<p id="tagline" class="fulljustify">Blah blah blah</p> 

/* CSS */ 
.fulljustify { 
    text-align:justify; 
} 
.fulljustify:after { 
    content: ""; 
    display: inline-block; 
    width: 100%;  
} 
#tagline { 
    height: 80px; 
    overflow: hidden; 
    line-height: 80px; /* vert-center */ 
}

Fuente

2012-02-07 17:51:30 manafire

Gracias funcionó para mí. :) – Bibhu

Para una sola línea, esto –

esto no funciona en versiones inferiores IE8 y FF. ¿Conoces alguna forma de implementar sin utilizar el pseudo código ': after' y' content'? gracias – Miron

Solo use style="text-align:justify".
Funciona en todos los navegadores.

Fuente

2013-01-26 09:06:46

algún tipo de explicación sería útil, ¿no? Obiviously usó tus estilos ... – Ron

@Ron Si quieres justificar todo el párrafo, excepto la última fila, usa el truco anterior, y si también quieres justificar la última línea, usa '.justify: after {content: ""; pantalla: bloque en línea; ancho: 100%;} 'y no es necesario definir altura. –

No, no funciona. – Siddharth

Chrome no lo admite, pero en Firefox y IE, puede usar text-align-last: justify;. Para una solución multi-navegador, tenemos que utilizar lo que @onemanarmy desplazados;)

Fuente

2013-12-20 09:51:20 alijsh

A partir de diciembre de 2016, ahora es compatible con todos los principales navegadores (65%) y es la mejor solución. – K48

Sí, esta es ahora la mejor (y la más simple) solución. Funciona muy bien en Chrome. –

No funciona en Safari. Es el navegador predeterminado en OS X, así que lo consideraría un navegador importante. – Gavin

probar esto

para div

div { 
text-align:justify; 
text-justify: inter-word; 
text-align-last:center; 
/* for IE9 */ 
-ms-text-align-last:center; 
}

Fuente

2016-03-01 11:05:46 venkat

gracias, salvaste mi tocino. Me encanta cómo se crearon estos estilos CSS sin ningún tipo de planificación, empujándolo hacia adelante con la barriga. – SpaceDog

También existe algo similar, como en la pantalla: flexionar; justify-content: space-around; si envuelve esos textos en intervalos o divs

Fuente

2017-08-18 09:35:05 WoodyDRN

Respuesta

Cuestiones relacionadas