People often confuse inheritance with the cascade. Although they seem related at first glance, the two concepts are actually quite different. Luckily, inheritance is a much easier concept to grasp.
Certain properties, such as color or font size, are inherited by the descendants of the elements those styles are applied to. For instance, if you were to give the body element a text color of black, all the descendants of the body element would also have black text. The same would be true of font sizes.
Read more ›
Ever wonder why they are called “cascading” style sheets? CSS allows you to apply several style sheets to the same document, which means there are bound to be conflicts. CSS handles such conflicts through a process known as the cascade.
The cascade refers to what happens when several sources of style information vie for control of the elements on a page: style information is passed down (“cascades” down) until it is overridden by a style command with more weight.
Read more ›
IE11, available for Windows 7 and 8.x, offers a new set of developer tools. Some of the new features includes:
New DOM Inspector/style feature:
- Improved highlighting of selected elements.
- New breadcrumb navigation shows the DOM path to the current element, allowing rapid navigation up and down the path hierarchy.
- You can now change the order of the DOM elements by dragging and dropping.
- Trace is a new feature that provides a concise summary list of all the properties applied from your stylesheets.
- The ability to filter computed styles.
- A new Events panel that allows us to Inspect events attached to DOM elements.
Read more ›
You can improve your development workflow by getting to know how these tools work in every browser.
Chrome developer tools have had the fullest feature set for some time now. Each new release tends to add more new and exciting features such as workflows, snippets, canvas inspection and source-mapping support. Read more ›
When naming your IDs and classes, it is important that you keep the names as “unpresentational” as possible.
For instance, if you want all of your form notification messages to be red, you could give them a class of red. This is fine as long as there are no other red elements on the page. However, say you wanted to style required form labels red as well. You are now forced to guess to which element that class could refer, and things are already starting to get confusing.
Imagine how confusing the code could become if you used presentational elements across the whole site? Read more ›