Classes CSS de largeur relative pour les présentations de thème

Pour rendre les éléments d'une page réactifs à différentes largeurs, les classes CSS de largeur relative ont été ajoutées aux présentations de thème. Ces classes sont des classes de marqueur uniquement. Aucun style n'est défini pour ces classes par défaut. Il en existe sur les conteneurs, les lignes et les colonnes des présentations pour vous permettre de définir vos propres styles qui sont associés aux classes comme il convient pour rendre les éléments de page réactifs aux différentes largeurs.

Il existe deux types de classes de largeur relative et un de chaque est utilisé sur chaque conteneur de présentation.

Type sémantique, correspondant à l'un des éléments suivants :

wpthemeThin

wpthemeNarrow

wpthemeMedium

wpthemeWide

wpthemeFull

Ces types autorisent jusqu'à cinq variations de largeur et ils sont décrits par des termes communs, comme étroit et large.

Type de grille, correspondant à l'un des éléments suivants :

wpthemeCol1of12

wpthemeCol2of12

wpthemeCol1of5

wpthemeCol3of12

wpthemeCol4of12

wpthemeCol2of5

wpthemeCol5of12

wpthemeCol6of12

wpthemeCol7of12

wpthemeCol3of5

wpthemeCol8of12

wpthemeCol9of12

wpthemeCol4of5

wpthemeCol10of12

wpthemeCol11of12

wpthemeCol5of5

wpthemeCol12of12

Ces types autorisent jusqu'à 16 variations de largeur et ils sont décrits à l'aide d'un système de numérotation d'unités de largeur de valeur N. A première vue, cela ressemble à un système de numérotation simple où une présentation à cinq colonnes utilise wpthemeCol1of5, wpthemeCol2of5, wpthemeCol3of5, wpthemeCol4of5 et wpthemeCol5of5 pour numéroter les colonnes. Toutefois, la meilleure manière d'aborder ce système ne consiste pas à se baser sur le nombre de colonnes mais plutôt sur le nombre d'unités de largeur que la colonne occupe sur la page. Ainsi, wpthemeCol2of5 signifie que la colonne utilise jusqu'à deux des cinq unités de largeur de la page, ou 2/5ths de la largeur de la page, et wpthemeCol8of12 signifie que la colonne utilise entre 8 et 12 unités de largeur de la page, ou 3/4ths de la largeur de la page. Ainsi, une présentation à cinq colonnes de largeur égale utilise wpthemeCol1of5 sur toutes les colonnes.