Classy

When I first wrote the CSS for my contact form, I wrote this:

.main-content {
max-width: 60%;
margin: 0 auto;
}

Which looked like it worked. Until I was reviewing some of my other pages and realized I had resized my work and work archive pages also. It’s nice that this was an obvious mistake. .main-content is a class used on many many pages so I really needed to differentiate my contact form page from any other. Lo and behold in the body element was this gem: page-id-47354. A very specific class for a very specific change. Easy Peasy!

.page-id-47354 .main-content {
max-width: 60%;
margin: 0 auto;
}