La propiedad display:inline-block se usa para mostrar un elemento en el contenedor de bloques de nivel en línea. Convierte el bloque de elementos en un elemento en línea. Use la propiedad de alto y ancho para establecer un elemento en línea. La propiedad de visualización se utiliza para evitar un salto de línea en una lista de elementos.
Sintaxis:
element {
display:inline-block;
}
Ejemplo:
<!DOCTYPE html>
<html>
<head>
<title>preventline break in list items</title>
<style>
li {
display:inline-block;
text-decoration:underline;
}
h1 {
color:green;
}
h1, h2 {
text-align:center;
}
body {
width:70%;
}
</style>
</head>
<body>
<h1>GeeksforGeeks</h1>
<h2>display:inline-block;</h2>
<b>Subjects Of Computer science:</b>
<ul>
<li>Computer Network</li>
<li>Operating System </li>
<li>Data Structure using C</li>
<li>Object Oriented Programming Concepts</li>
<li>Digital Electronics</li>
</ul>
</body>
</html>
Producción:
Navegadores compatibles: los navegadores compatibles con la propiedad de visualización CSS se enumeran a continuación:
- Apple Safari 3.1
- Google Chrome 4.0
- Firefox 3.0
- Ópera 7.6
- Internet Explorer 8.0
Publicación traducida automáticamente
Artículo escrito por ManasChhabra2 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA