PluXml.org

Blog ou CMS à l'Xml

Vous n'êtes pas identifié(e).

#1 27/07/2017 22:04:24

grisbi
Membre
Inscription : 23/11/2013
Messages : 95

class container

Bonjour à tous

Je mets doucement les mains dans plucss et j'aurais une petite question :

La class container faut il la mettre a chaque objet (exemple un formulaire) ou a
chaque page ?

En decortiquant certains codes sources de themes je me suis aperçu que cette
classe aparaissais quelquefois mais pas tujours

merci de m'éclairer

a+

Hors ligne

#2 28/07/2017 10:10:28

kowalsky
Membre
Inscription : 20/08/2015
Messages : 289
Site Web

Re : class container

@grisbi : tout dépend du codeur et du code css utilisé avec smile mais cette classe est usuellement utilisée pour englober et délimiter toute la page (la classe .container est souvent remplacée par .page).  (http://romy.tetue.net/structure-html-de-base)

Dans PluCSS, elle permet de s'assurer que la balise qui y fait appel ne dépassera pas 1280px de large, avec une marge latérale de 1,5rem en affichage normal (la marge varie en fonction de la largeur d'affichage via les media query).

.container {
    margin: 0 auto;
    max-width: 1280px;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
    width: 100%;
}

On voit donc que son rôle principal est de limiter la largeur d'un objet assez grand et d'y associer une marge. Cette classe peut donc être réutilisée pour cet usage si besoin, cependant :

  • Ne pas confondre avec la classe .content qui défini souvent un "contenu" et est beaucoup plus présente dans le code html d'une page web

  • Et aussi à ne pas confondre avec la définition française d'un "bloc conteneur" (phonétiquement proche du mot anglais "container") qui sert à encadrer plusieurs balises (par exemple un formulaire avec ses différents champs - à noter qu'en html5 on préfèrera utiliser la balise <form> avec son code css associé pour structurer le formulaire)

Dernière modification par kowalsky (28/07/2017 10:16:11)

Hors ligne

Pied de page des forums

A propos Nous soutenir Contact Twitter Google+
Copyright © 2006-2017 PluXml.org, tous droits réservés