Cómo alinear verticalmente líneas de diferentes li en listas con viñetas personalizadas

  • Autor Autor seonthebeach
  • Fecha de inicio Fecha de inicio
S

seonthebeach

Gamma
Buenas, quiero saber si se podría hacer que en un <li> de una lista con viñetas personalizadas, las diferentes lineas de un mismo li, estuvieran alineadas verticalmente.

Por ejemplo:

Tryit Editor v3.5

(Copiar y pegar lo de abajo) Como podeis ver la segunda linea empieza a la altura de la corona, y quiero que empiece a la altura de la primera letra de la primera linea. Gracias 🙂

<!DOCTYPE html>
<html>
<head>
<style>
ul {
list-style: none; /* Remove HTML bullets */
}

li::before {
content: ""; /* Insert content that looks like bullets */
}

</style>
</head>
<body>
<ul>
<li> Coffee Coffe Coffe Coffee Coffe CoffeCoffee Coffe CoffeCoffee Coffe CoffeCoffee Coffe CoffeCoffee Coffe CoffeCoffee Coffe Coffe</li>
</ul>
</body>
</html>
 
Algo asi:

<!DOCTYPE html>
<html>
<head>
<style>
ul {
list-style: none; /* Remove HTML bullets */
}

li::before {
content: ""; /* Insert content that looks like bullets */
}

</style>
</head>
<body>
<ul>
<li>Coffe</li>
<li>Coffe</li>
<li>Coffe</li>
<li>Coffe</li>
<li>Coffe</li>
<li>Coffe</li>
<li>Coffe</li>
<li>Coffe</li>
<li>Coffe</li>
</ul>
</body>
</html>
 
Atrás
Arriba