¿Cómo prevenir los saltos de línea en la lista de elementos usando CSS?

Prevención class línea en CSS : Aquí, vamos a aprender cómo prevenir saltos de línea en la lista de elementos usando CSS?

Introducción:

se ocupan de diversos artículos en el CSS a veces plantean problemas muy diferentes. El problema podría ser cualquier cosa, podría estar relacionado con el posicionamiento, arreglo, y todo eso, por lo tanto, todos estos tipos de problemas requieren soluciones inteligentes y creativas. Las soluciones se consideran mejores, si no aumentan la línea de los códigos en lugar de optimizar el código completo de una manera mucho más eficiente para resolver simultáneamente el problema. Este tipo de soluciones son conocidos por ser una buena solución, pero no todo el mundo puede llegar a soluciones, aunque hay que seguir intentando. Sin embargo, incluso si no lo hace, estos artículos son siempre por ahí break su conveniencia en un solo clic de distancia. Ahora, tomemos esta discusión más allá y hablar sobre el tema antes mencionado.

¿Cómo podemos evitar los saltos de línea en la lista de elementos usando CSS? Bueno, muchos desarrolladores de venir a través de esta cuestión en un momento de su período de desarrollo. El problema puede parecer complicado y confuso, pero la solución es muy fácil de entender y usted será capaz de aprender en poco tiempo. Como se dijo anteriormente, se trata de una lista de elementos puede llegar a ser complicado, por lo tanto, estos tipos de problemas tienden a ocurrir. Además, sería muy bueno si podemos evitar los saltos de línea en una lista de elementos y que también con la ayuda de CSS. Así que vamos a entrar a la derecha en la solución y acabar de una vez.

Solución:

La propiedad en juego aquí, para hacer frente a este problema sería propiedad display: inline-block . Esta propiedad se utiliza para visualizar cualquier elemento en la carpeta de bloques a nivel de línea. Esta propiedad tiene un papel de convertir el bloque de los elementos en un elemento en línea. Es posible utilizar la altura y la anchura de la propiedad para establecer o fijar un elemento en línea. Por lo tanto, esta propiedad de presentación juega un papel importante en la prevención de la for línea en una lista de elementos usando CSS.

Sintaxis:

    element {
display:inline-block;
}

Ejemplo:

<!DOCTYPE html>
<html>
<head>
<style>
li {
display: inline-block;
text-decoration: underline;
}
body {
width: 70%;
}
</style>
</head>
<body>
<h2>Prevent line breaks in list</h2>
<b>Languages on IncludeHelp:</b>
<ul>
<li>C++</li>
<li>Java </li>
<li>Python</li>
<li>Scala</li>
<li>Android</li>
</ul>
</body>
</html>

salida

How to prevent line breaks in the list of items using CSS? - 4

En el ejemplo anterior, no hay nueva línea class cada lista.

Terminar nota:

tanto, como se vio, haciendo uso de propiedad de presentación puede evitar los saltos de línea en una lista de elementos que utilizan CSS . Bastante derecho solución fácil? ¡Te lo dije! Todo lo que tienes que hacer es hacer uso de una sola propiedad y listo, problema resuelto. De esta manera los saltos de línea no te molestará nunca más cada vez que va a crear una cierta lista de artículos y su código no quede alterado tanto. Entonces, ¿qué estás esperando break ahora? Usted tiene la solución, por lo que seguir adelante y tratar este cabo este método.


Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *