entonces estoy usando Nextjs para codificar un sitio web, quiero que mi texto más largo se muestre como 2 líneas
por ejemplo esto
This is an examplesería así en su lugar
This is an example Después de investigar un poco, encontré algo, luego lo agregué a mi archivo styles.js pero no funcionó. Tal vez lo estoy malinterpretando
exampleClass: { fontSize: 13, width: '81px', display: 'webkit-box', WebkitBoxOrient: 'vertical', WebkitLineClamp: 2, textOverflow: 'ellipsis', overflow: 'hidden', },Me ha estado molestando por un tiempo ahora, por lo que cualquier ayuda sería muy apreciada. Gracias
¡Bienvenido a Stackoverflow! Esta parece ser una pregunta directa de HTML/CSS frente a cualquier cosa que tenga que ver con NextJS o javascript; debe considerar eliminar la etiqueta nextjs y simplemente etiquetarla como una pregunta de html/css . Una vez dicho esto,
Tienes varias opciones.
<br/> donde desee obtener el descanso. es decir This is an <br/> exampleword-break en CSS, ejemplo <div class="container"> This is an example </div>
donde el CSS correspondiente podría establecer el ancho y el ajuste
En tu CSS
.container { width: 100px; word-break:break-all; /* Assuming 100px is what it takes and introduces a line break for you */ }