0
304
Views¿Hay alguna etiqueta CSS para justificar el contenido (como en Word)?
Quiero que las marcas Nacionales e Internacionales se coloquen en el centro debajo del presente texto anterior.
Producción:
El código CSS-
.ans{ padding-top: 1.2vh; display:flex; color:lightsalmon; font-size: 5vh; text-justify: auto; }El código HTML-
<div id="qa"> <p class="q"> Why HOTPICKS? </p> <p class="ans"> HOTPICKS provides a discount of Upto 75% on National and International Brands. </p> </div>1 answers
Answer question0
NOTA: evitar text-align-last: center; debido al bajo apoyo. ( https://caniuse.com/css-text-align-last )
El problema es cómo centrar una línea específica de un texto o cómo ajustar exactamente. Si es crítico, lo que probablemente haría mientras investigo una solución sería envolver la línea en una etiqueta de intervalo con pantalla: bloquear pero eliminar esta pantalla: bloquear en resoluciones bajas (usando consultas @media).
Vea el siguiente fragmento (sin @media para ver un problema de interrupción en baja resolución)
.ans{ padding-top: 1.2vh; color:lightsalmon; font-size: 5vh; text-align: center; } .ans span { display: block; } .q { text-align: center; } <div id="qa"> <p class="q"> Why HOTPICKS? </p> <p class="ans"> HOTPICKS provides a discount of Upto 75% on <span>National and International Brands.</span> </p> </div>Esto funciona, pero el descanso podría ser extraño con poca resolución de ancho, por eso recomiendo desactivarlo en el móvil.
Esto significa modificar html, pero prefiero eso a superhacky css trucos extraños usando márgenes. Cuestión de preferencias personales.