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

Brandon Mulholand
Brandon Mulholand
2,115 Points

Thought process of CSS

Hello!

I have sort of an odd question. I've dabbled in C++ for about a year or so. In C++, or any language used for "traditional" programming, the objective is clear, if you will allow a very liberal oversimplification: You set some goal for your program and write it in such a way that it is easily maintained, extensible, readable, and efficient in terms of memory.

What is the thought process in CSS? I suppose that I mean to ask is CSS an art or a science? In other words, is there some underlying goal of CSS, such as filling up space to an exact amount, and ensuring everything is accounted for? Or is it more liberal, adopting a stance of adding 10px here or there because it looks cool?

As an example, is it appropriate to eyeball something and say, "Well, that looks centered to me," or must I know mathematically that it is centered?

Thanks in advance for your thoughts!

Brandon

1 Answer

James Barnett
James Barnett
39,199 Points

CSS exists to support the design of the site so it's part programming (e.g. more like science) and part design (e.g. more like art)

Because of the nature of the medium being with their being so many screen sizes, resolutions and DPIs the goal isn't to have 15px here but is to support he user experience, branding and visual design, basically to have a good overall look and feel of the site across whatever device is being used to view the device.

Brandon Mulholand
Brandon Mulholand
2,115 Points

Thanks for the response. It was a good one. However, I think I phrased my question poorly. I do understand the point in CSS, but not so much the "safe" methods for achieving said point.

I think the last part really encapsulates my question:

"As an example, is it appropriate to eyeball something and say, 'Well, that looks centered to me,' or must I know mathematically that it is centered?" (For example, it is possible to text-align: center; and then still have it not aligned with other centered elements due to other styling properties. It then takes a little more editing, eventually achieving the APPEARANCE of being centered, although I may not know that it is logically or mathematically centered precisely according to the code.)

In fact, if I may ask that question and that question only, it might give me the insight I'm looking for. I understand that what works in one browser may not work in another, or on mobile, but if I have achieved the look I want, is that good enough? Or is there some hidden and underlying rigor to where I must know that it is centered precisely according to the code, and not just by appearance?

Thank you for your time, James! You've been a big help.

James Barnett
James Barnett
39,199 Points

In terms of checking your layout, you might want to use a layout grid to check it.

If you go to http://codepen.io/jamesbarnett/full/zGDBl it uses hashgrid

  • press g to see the grid
  • press g + h to hold the grid
  • press f to bring to the grid to the foreground pressg` again to discuss a held grid

Grids are on the more mathematical side of CSS. To start learning about using grids in CSS check out the grid layout badge in CSS Layouts course here on Treehouse.

If you want to learn more about the background behind how grids are made check out:

Brandon Mulholand
Brandon Mulholand
2,115 Points

Thanks, James! You're the man. Sweet beard, by the way.