rs79.vrx.palo-alto.ca.us

affect-other

class and type

conflicts

id or class

inheritence

less class

mutiple classes

affect-other The button and the light problem You may have a button that when pressed makes a light come on. You can do this in CSS but what is the syntax to affect a CSS object when a different one is triggered? There is no one answer, it depends on the structure of the document. The problem is not that it is not possible to address the other element, the problem is the scope of hover does not allow it, thye have to share a common parent in the dom tree in the syntax of the code. IE, thing -> anything anything -> thing will not work parent.container 1, container 2, ... container n.thing|anything is what you'd need to say instead for each term. class and type Combining class and type selectors Class and type selectors can be used together div.big { color: blue; } td.big { color: yellow; } label.big { color: green; } form.big { color: red; } conflicts Handled badly. Zero permitted. Avoid them. Rename things. CSS is so braindead it uses a bizarre weighting system that uses number of times you use things. So as you change your code all the rules might change for the sole reason the number of monstrances of on type of selector just changed and when recalculated, everything is different. One small change unrelated to what happens now breaks everything. Thus the solution to conflicts is to eliminate them not to rely on them ever doing anything rational. id or class When to use id, when to use class. Classes can be used as many times as needed within a document. IDs can only be applied once within a document. The ID specifies a name unique to the document, there can not be another occurrence wheras class is used to indicate things are part of a set with at least one common value. If you refer to a single thing, use ID. If you're referring to more than one thing, use class.

inheritence How inheritance works, why and when it doesn't. Things contain the property of the parent thing. Except where they do not and there is an issue with fonts. less class Think before you class Before using a class selector, you should ask yourself: here an existing HTML element that could be used instead? here a class or id further up the document tree that could be used? mutiple classes How to specify multiple CSS classes <p class="big indent"> .big { font-weight: bold; } .indent { padding-left: 2em; }