Archive for the ‘Web Design’ Category

Everything Does Not Float

Panta rhei, said Herakleitos, everything is floating. Even if the underlying philosophy, that everything is constantly changing, very much applies to the web, it doesn’t apply to today’s topic. To make an element float we have to say so explicitly, for instance like this: float:left

When we make an element floating, we ask the browser to shift it sideways, either to the left or to the right, as far as it will go.

Those who really understand the previous sentence already know half of what you need to know to use floats. There are three important pieces of information in that sentence, so let us examine them before we tackle the other, somewhat trickier, half.

There are a few things you should note regarding floated boxes. For one, the box being floated should have a width defined for it, either explicitly or implicitly. Otherwise, it will fill its containing block horizontally, just like non-floated content, leaving no room for other content to flow around it. As such, floated boxes are always treated as block boxes, even if they are defined using inline elements.

The concept of floats is probably one of the most unintuitive concepts in CSS. Floats are often misunderstood and blamed for floating all the context around it, causing readability and usability problems. However, the reason for these problems isnt the theory itself, but the way the theory is interpreted – by developers

Apart from Floats, the CSS Specificity is one of the most difficult concepts to grasp in Cascading Stylesheets. The different weight of selectors is usually the reason why your CSS-rules dont apply to some elements, although you think they should have. In order to minimize the time for bug hunting you need to understand, how browsers interpret your code. And to understand that, you need to have a firm understanding on how specificity works. In most cases such problems are caused by the simple fact that somewhere among your CSS-rules youve defined a more specific selector.

The Semantic Web provides a common framework that allows data to be shared and reused across application, enterprise, and community boundaries. It is a collaborative effort led by W3C with participation from a large number of researchers and industrial partners. It is based on the Resource Description Framework (RDF). See also the separate FAQ for further information.