Hola a todos, como dice el titulo no me anda css grid. y no encuentro el problema, son 3 div nada mas que se tienen que hacer columnas...
dejo código
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@300&display=swap" rel="stylesheet">
<link rel="stylesheet" href="viewpublic.css">
</head>
<body>
</body>
<div class="grid">
<div>
Lorem ipsum dolor sit, amet consectetur adipisicing elit. Voluptas, architecto.
</div>
<div>
Lorem ipsum dolor sit, amet consectetur adipisicing elit. Voluptas, architecto.
</div>
<div>
Lorem ipsum dolor sit, amet consectetur adipisicing elit. Voluptas, architecto.
</div>
</div>
</html>
y mi CSS es:
.grig {
display : grid;
/* grid-template-rows: 100px 100px;*/
grid-template-columns: 33% 33% 33%;
}
.grid div {
background : #ecf0f1;
padding : 1em;
}
.grid div:hover {
border : #f1c40f solid 1px;
}
No es el código supongo es lo mas simple que hay ,... tengo Google Chrome y Firefox , en ninguno me anda..
he reiniciado la maquina, le pase el ccleaner...
Si alguien me ayuda, gracias.. y disculpen si es una tontera.
Saludos a todos
Rebe
Solucionado
cambie esta linea
<div class="grid">
por
<div class="grid-rebe">
y en CSS también. .. raro...
.grid-rebe{
display:grid;
/* grid-template-rows: 100px 100px;*/
grid-template-columns: 33% 33% 33%;
}
.grid-rebe div {
background : #ecf0f1;
padding : 1em;
}
Gracias.!!
Saludos.!!!!
Hola Rebe! jaja creo que es porque en el código original, cuando declarabas el .grid{} en el .css en lugar de poner grid habías puesto grig.
Revisa el código del primer mensaje del post, fijate que dice .grig
Creo que fue por eso, saludos!
No tienes permitido ver enlaces.
Registrate o Entra a tu cuenta
y mi CSS es:
.grig {
display : grid;
/* grid-template-rows: 100px 100px;*/
grid-template-columns: 33% 33% 33%;
}