Discussion :

[Petite Crapule]

Bonjour à tous!

Je reviens avec mon problème de dimension. Sur les conseils de Rodolphebdr, j'ai lu ceci au sujet du Responsive Web Design pour centrer le contenu de ma page, car présentement, il est collé tout à gauche. En clair, je veux que tout ce qui se trouve dans ma balise Body soit centré au milieu de la page. Pour commencer, on dit de dimensionner le site dans une résolution optimale. Je fais ça comment?


Avant toute chose, il faut faire en sorte de créer un site dont la grille d'affichage soit flexible. Autrement dit, nous n'utilisons en aucun cas (ou tout du moins, le moins possible) de largeur/hauteur fixe.

Pour commencer, dimensionnons le site dans la résolution dite « optimale », à savoir la résolution pour laquelle l'affichage est la plus adaptée (par exemple 1280 * 800 pixels).

Signé : une débutante très débrouillarde, mais qui tourne en rond dans ce cas précis!

[Muchos]

Quand vous lisez un article dans un magazine "papier", l'article est mis en page de manière fixe. Vous ne pouvez pas agrandir ou rapetisser le magazine.
À l'inverse, un magazine en ligne peut être lu sur un PC, un smartphone, une tablette, etc. Il faut donc que la mise en page de cet article soit la plus fluide possible, c'est-à-dire qu'elle puisse subir le plus de déformations possibles sans devenir illisible.
Ainsi, il est conseillé d'utiliser des unités relatives pour dimensionner vos éléments (pourcentages, unités ex/em/rem…) et d'être prudent avec les positionnements absolute/fixed.

Aujourd'hui, 9 internautes sur 10 naviguent en mode "desktop": la résolution optimale est donc celle de la majorité des écrans de PC, c'est-à-dire que vous allez mettre en page votre site en imaginant qu'il sera typiquement lu sur une résolution 1280×800 pixels. Néanmoins, quand vous testerez la souplesse de votre mise en page sous des résolutions plus grandes ou plus petites, vous allez finir par la "casser" sur deux résolutions: une plus grande que 1280×800 pixels, et une plus petite. On appelle cela des «points de rupture». Avec les CSS media queries, vous pouvez corriger voire refaire une mise en page pour une nouvelle fourchette de résolutions.

[Petite Crapule]

Finalement, je crois que je pose la mauvaise question. Si je veux que mon contenu soit centré au milieu de la page, dois-je procéder avec des marges gauche-droite? Ou avec ce qu'on appelle un cadre que je centre? Ou j'encadre mon contenu avec un tableau que je centre?

[Muchos]

Avez-vous seulement les bases en CSS ? Si non, je vous conseille de parcourir certains de ces tutoriels CSS (mise en page simple, centrer un bloc…).

[provectio]

Ou j'encadre mon contenu avec un tableau que je centre?

Essayez quand même d'éviter cette technique de tableau ! Sinon vous avez la possibilité de vous tourner vers des front-end templates comme html5boilerplate ou bootstrap

[Petite Crapule]

J'ai justement parcouru ici les tutoriels sur le CSS. Je me suis donc un peu familiarisée avec ce langage, mais je n'ai pas réussi à faire fonctionner aucune balise à l'intérieur de mes balises HTML. J'ai fait des essais copier-coller du genre :

Code css :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
body {
  background-color: #FF0000;
}

mais ça ne fonctionne pas.

Je vais lire attentivement ces tutoriels et... revenir à la charge si je n'ai pas réglé mon problème.

Merci!

[Anthony.v]

As-tu placé ton code css dans la balise "style"? ou si tu utilises un fichier externe as-tu fait un lien qui pointe sur ton fichier ?