Mudanças entre as edições de "Predefinição:Teste/styles.css"
Ir para navegação
Ir para pesquisar
(Limpou toda a página) Etiqueta: anulando |
Etiqueta: Revertido |
||
| Linha 1: | Linha 1: | ||
.news-grid { | |||
display: flex; | |||
flex-wrap: wrap; | |||
gap: 16px; | |||
margin-top: 12px; | |||
} | |||
.news-card { | |||
background-color: #1f1f1f; | |||
color: white; | |||
border-radius: 6px; | |||
overflow: hidden; | |||
width: 100%; | |||
max-width: 100%; | |||
box-shadow: 0 2px 6px rgba(0,0,0,0.2); | |||
display: flex; | |||
flex-direction: column; | |||
} | |||
.news-card img { | |||
width: 100%; | |||
height: auto; | |||
display: block; | |||
} | |||
.news-content { | |||
padding: 10px 12px; | |||
} | |||
.news-title { | |||
font-weight: bold; | |||
font-size: 14px; | |||
margin-bottom: 4px; | |||
} | |||
.news-sub { | |||
font-size: 12px; | |||
color: #ccc; | |||
} | |||
/* Responsivo */ | |||
@media screen and (min-width: 600px) { | |||
.news-card { | |||
flex: 1 1 calc(50% - 8px); | |||
} | |||
} | |||
@media screen and (min-width: 1000px) { | |||
.news-card { | |||
flex: 1 1 calc(50% - 8px); /* se quiser 3 cards, troca pra 33.3% */ | |||
} | |||
} | |||
Edição das 01h10min de 2 de junho de 2025
.news-grid {
display: flex;
flex-wrap: wrap;
gap: 16px;
margin-top: 12px;
}
.news-card {
background-color: #1f1f1f;
color: white;
border-radius: 6px;
overflow: hidden;
width: 100%;
max-width: 100%;
box-shadow: 0 2px 6px rgba(0,0,0,0.2);
display: flex;
flex-direction: column;
}
.news-card img {
width: 100%;
height: auto;
display: block;
}
.news-content {
padding: 10px 12px;
}
.news-title {
font-weight: bold;
font-size: 14px;
margin-bottom: 4px;
}
.news-sub {
font-size: 12px;
color: #ccc;
}
/* Responsivo */
@media screen and (min-width: 600px) {
.news-card {
flex: 1 1 calc(50% - 8px);
}
}
@media screen and (min-width: 1000px) {
.news-card {
flex: 1 1 calc(50% - 8px); /* se quiser 3 cards, troca pra 33.3% */
}
}