More Related Content
Similar to CSS Architecture (20)
CSS Architecture
- 6. • Doing it wrong.
• Doing it right.
• Communication.
- 11. • Knows only about its inside.
• Looks the same wherever it is put.
- 12. .form-inputs {
. . .
}
!
.form-actions {
.button {
text-align: right;
margin-left: 1rem;
}
}
- 13. .form-inputs {
. . .
}
!
.form-actions {
margin-top: 1rem;
.button {
text-align: right;
margin-left: 1rem;
}
}
- 14. .form-actions {
.button {
text-align: right;
margin-left: 1rem;
}
}
!
.default-form .form-actions {
margin-top: 1rem;
}
!
.vertical-form .form-actions {
margin-top: 0.5rem;
}
- 20. • Subscribe to other developers
structure/naming/style.
• Potential to bloat/unneeded stuff.
• Ability to scale.
• Framework conventions.