Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

CSS CSS Foundations Selectors Grouping and Modifying Selectors

Posted by Christoph Wolf
Christoph Wolf
2,039 Points

i think the shapes should have their own attributes

i guess this exercise has just a bad example.. i think shapes must declare their own attributes like width height, radius aso... because to me they are objects... i know that you just wanted to show how cascading should be used to not repeat yourself too often, bur i guess with this example of shapes we have to let those shape have attributes of identity for themselves to stay individually modifiable... just my feeling ;-)

4 Answers

Claudia Almeida
Claudia Almeida
9,291 Points

I disagree... for example, if later on I decide that I want my shapes to be bigger, I would have to change their width and height individually, one by one...that would take a long time. I like the grouping concept, seems a little more complicated to grasp at first, but on the long run - specially when building larger, more complex websites - I know it will be more practical :D

Dave Koch
Dave Koch
5,389 Points
Dave Koch
Dave Koch
5,389 Points

I totally disagree with doing things this way for something like this. I DO seperate out properties that I might repeat, such as a shadow element I might apply to images and some divs, or bolding or font styles....

But for object shapes, I say they should not be broken up like this, for a variety of reasons.

While this works well in this example, and as a lesson, in real life coding, each shape should be stand alone and not combined. First, it is just plain hard to read. If someone has to come in and edit someone elses work, this makes the css substantially harder to read, understand and edit.

Secondly, as style sheets grow, and new properties get introduced, it is likely that .base might get separated from .radius or ellipse, making any of the three harder to edit.

Third, in real world circumstances, clients are always changing things. It is inevitable that they will want the circle 2 pixels smaller, it the ellipse a different shade. Then you have to go in and pull them all apart again.

So while I understand this as a demonstration device, it is (for Objects) impractical in real world coding.

Just my 2 cents...

Christoph Wolf
Christoph Wolf
2,039 Points
Christoph Wolf
Christoph Wolf
2,039 Points

right ;-) i dug a bit depper and thought it might have its benefits^^ then realized i couldn't delete my post :-D

Michael Ruggles
Michael Ruggles
4,181 Points
Michael Ruggles
Michael Ruggles
4,181 Points

Just as a point of reference....

http://codepen.io/MichaelRuggles/pen/utilb

I made this while still pretty new to css or web development in general, and while I was writing the code I instinctively consolidated all the similar code for the boxes under a 'div' selector. Either that or you rewrite the same thing three times - no fun (imagine if you had 100 tiny boxes...).

Also, any element within an HTML document is always able to be individually modified. There is no reason to ever pull anything apart (unless you want to). If an individual element needs to be changed, then just add styling for that element below your previous code. Or just use an ID selector and it will take precedence over the previous styling.