HTML5 : Nouveaux éléments de section, article, header, footer, aside, nav

Les éléments de section HTML5, une nouvelle façon de penser Les éléments de section (section, article, nav, aside, header, footer) segmentent des portions du document ou de l'application web, qui possèdent une valeur sémantique particulière ; contrairement à des éléments génériques comme span ou div qui ont un rôle totalement neutre, et ne servent qu'à regrouper d'autres éléments HTML pour leur affecter un style CSS commun, voire pour interagir avec eux via le DOM... Il ne s'agit donc pas de nouveaux éléments avec des noms génériques : c'est bien plus que ça ! HTML5 inclut la majorité des éléments HTML4 pour assurer une rétro-compatibilité avec les navigateurs. Au-delà de ce critère, les groupes de travail qui ont élaboré HTML5 ont su analyser les usages courants et s'adapter aux tendances du web avec (entre autres) les nouvelles façons de trier l'information sur une page web. Liste récapitulative des éléments de section HTML5 Un cas particulier : Internet Explorer <9 Exemples de documents

CSS3 Demos @ Grains of Sand HTML 5 : Div et span, différences d'usage pratique Ces deux balises sont des conteneurs qui sont destinés à structurer le contenu, mais ils ont un rôle complémentaire et des règles de rendu différentes. Span sert surtout à associer un style à une partie d'un texte tandis que div sert à agencer le contenu de la page. Les deux balises doivent avoir une balise de début et de fin, la forme réduite n'est pas reconnue évidemment. N'est pas valide par exemple ceci: Le format seul valide est celui-ci: La balise peut être vide. Div La balise <div> est un bloc, donc un objet rectangulaire qui ne peut être réparti sur plusieurs lignes. Par exemple, le texte suivant: <div>0000000<div>111111</div>222222</div> s'affiche ainsi: Span La balise <span> est inline, elle s'inscrit dans le flux du contenu, peut être répartie sur plusieurs lignes. <span> n'a pas de saut de ligne et le texte suivant: <p><span>0000000<span>111111</span>222222</span></p> s'affiche donc ainsi: Margin On ne peut pas attribuer une marge externe avec l'attribut margin. Height et width Padding

Initiation au positionnement CSS (partie 2) Le positionnement des éléments en CSS est sans aucun doute l'un des aspects les plus intéressants de cette technologie, mais également l'un des plus ardus. Positions, flux et autres flottants sont pourtant des notions essentielles à une bonne maîtrise de la mise en page. Si de plus en plus d'intégrateurs semblent aujourd'hui acquérir les bases du comportement de ces propriétés, les choix des techniques demeurent couramment discutables, tout au plus hasardeux. Voyons ces méthodes de positionnement en détails afin de ne plus se laisser aller à des choix arbitraires incohérents. Sommaire du document Parce qu'une révision des bases ne fait jamais de tort… La section qui suit se contente d'introduire brièvement les notions de positionnements disponibles en CSS. Notion de flux Le flux d'un document pourrait se définir comme étant le comportement naturel d'affichage des éléments d'une page web. Les éléments de type block (h1, p, ul, ol, dl, table, blockquote, etc.) Revenir au sommaire Un habillage