Solucionado
Não vejo que tem necessidade de usar o código...
article { padding-bottom: 30px; border: 1px solid #ccc; margin-bottom: 20px; }
Bastaria usar o código...
article { border-bottom: 1px solid #ccc; padding: 10px 0 30px 0; }
Que tem o mesmo efeito, não? Pouparia linhas de código.
Obrigado
Olá João Pauto! Da forma que você fez você está usa mais código desnecessariamente.
Veja bem, o article precisa de um Padding Bottom, uma Bordar de 1 px e uma Margin Bottom de 20 px. Porém você apenas deu um Border Bottom e um Padding sendo que adicionou Padding Top também, quando so deveria ser Bottom. Além disso você está tendo que escrever o Padding Right e Left como 0. O certo de seu segundo código seria:
article {
padding: 0 0 30px 0;
border: 1px solid #ccc;
margin-bottom: 20px;
}Ou :
article {
padding: 0 0 30px 0;
border: 1px solid #ccc;
margin: 0 0 20px 0;
}Mas veja que assim você está adicionando mais informação desnecessariamente, pois você está tendo que colocar o tanto o padding como o margin top, left, right.
Enfim, espero ter ajudado! Bons Estudos!
Olá Romário, mas quanto mais linhas de código mais não fica mais "lento" o processamento do css pelo browser?
Ou no caso que eu usei
article {
border-bottom: 1px solid #ccc;
padding: 10px 0 30px 0;
}
fica mais lento do que
article {
padding-bottom: 30px;
border: 1px solid #ccc;
margin-bottom: 20px;
}
?