background preloader

CSS2

Facebook Twitter

Preventing attacks on a user's history through CSS :visited selectors. Web browsers remember what pages a user has visited recently.

Preventing attacks on a user's history through CSS :visited selectors

They use this history for a number of things, such as making links a different color if the page they link to was visited and providing autocompletion in the URL bar. It's been widely known for a while that CSS's ability to style visited links differently from unvisited ones, combined with other Web technology such as JavaScript or simply loading of background images, lets Web pages determine whether a URL is in the user's history very quickly and without any interaction from the user. This is true in current versions of all major Web browsers. I have a solution that I believe fixes this problem, and therefore helps users keep their history private when they use a Web browser implementing that solution. How CSS can be used to query a user's browser history Before describing the details of the solution, I'd like to describe the details of the problem. Limits of proposed solution Effects on Web pages Proposed solution relevant link. CSS Circles. A while back I shared a clever technique for creating triangles with only CSS.

CSS Circles

Over the past year, I've found CSS triangles incredibly effective, especially when looking to create tooltips or design elements with a likewise pointer pattern. There's another common shape that's easy to create, and that is the circle. Using border-radius, you can create wonderful CSS circles. Setting the border-radius of each side of an element to 50% will create the circle display at any size: It's really that simple...but I can't let this post go without touching on CSS gradients and basic spin animation: Voila.

CSS circles don't immediately appear as useful as CSS triangles, but they surely have value within design. An Introduction To Object Oriented CSS (OOCSS) - Smashing Coding. Advertisement Have you ever heard the phrase “Content is King”?

An Introduction To Object Oriented CSS (OOCSS) - Smashing Coding

Being a Web developer, and therefore having a job that’s often linked to content creation, it’s likely you have. It’s a fairly overused but true statement about what draws visitors to a site. From a Web developer’s perspective, however, some may argue that speed is king. More and more, I’m starting to favour that stance. Unfortunately, CSS seems to get somewhat overlooked in this area while many developers (for good reason) focus largely on JavaScript performance and other areas.

In this post, I’ll deal with this often overlooked area by introducing you to the concept of object oriented CSS and how it can help improve both the performance and maintainability of your Web pages. The Principles Of OOCSS As with any object-based coding method, the purpose of OOCSS is to encourage code reuse and, ultimately, faster and more efficient stylesheets that are easier to add to and maintain. Separation of Structure From Skin The Media Object.

320 and up. Compass Documentation. Instant CSS Documentation Search. CSS3 Generator - By Eric Hoffman & Peter Funk. How To Create an IE-Only Stylesheet. Selectors. 5.1 Pattern matching In CSS, pattern matching rules determine which style rules apply to elements in the document tree.

Selectors

These patterns, called selectors, may range from simple element names to rich contextual patterns. If all conditions in the pattern are true for a certain element, the selector matches the element. The case-sensitivity of document language element names in selectors depends on the document language. The following table summarizes CSS 2.1 selector syntax: 5.2 Selector syntax simple selector is either a type selector or universal selector followed immediately by zero or more attribute selectors, ID selectors, or pseudo-classes, in any order.

Note: the terminology used here in CSS 2.1 is different from what is used in CSS3. Selector is a chain of one or more simple selectors separated by combinators. Combinators are: white space, ">", and "+". The elements of the document tree that match a selector are called subjects of the selector. 5.2.1 Grouping Example(s): is equivalent to: [att]