Ubuntu-fr

untitledoc

HTML-CSS:question bonne pratique et problème pour donner une propriété

Bonjour à tous,

Je suis en train de construire un site et j'essaie de respecter les bonnes pratiques mais je me retrouve confronté à une interrogation. J'essaie au maximum de séparer la mise en page du contenu. Et lorsque je regarde sur internet comment centrer ma mise en page, la méthode apparemment la plus employée est de créer un div "global" pour lui appliquer un margin auto. La question que je me pause est alors de savoir si c'est encore une "bonne" pratique car il faudra donc rajouter directement en HTML une balise qui ne servira qu'à la mise en page?
Je me suis donc dit que j'allais mettre ce margin: auto dans le body directement: ça marche, mais... est-ce qu'il est recommandé de faire comme ça?

Ensuite, en voulant commencer à travailler un peu la mise en page, je me suis retrouvé un peu limité sans ce div global pour par exemple appliquer une ombre portée au contenu principal ("main" et sidebar, un peu à la manière de ce site).
Donc là je me suis dit qu'il n'était peut etre pas possible de travailler sans div global, jee l'ai donc rajouté une et là est ma deuxième question, plus pratique, mais je n'y suis pas arrivé. Ca doit sans doute être quelque chose de con à régler mais je ne vois pas quoi. Voici un exemple du problème : http://vincentgires.com/test/ le div global devrait avoir un background green, or je n'ai rien de cette couleur. Quel est le problème dans ce que j'ai fait?

Merci d'avance! )

Cowa

Re : HTML-CSS:question bonne pratique et problème pour donner une propriété

Bonjour,

#main {
	float: left;
	background: #fff; <---- blanc !
	overflow: auto;
	width: 70%;
}

Tu appliques une couleur blanche, donc forcément c'est pas vert !

tiramiseb

Re : HTML-CSS:question bonne pratique et problème pour donner une propriété

La question que je me pause est alors de savoir si c'est encore une "bonne" pratique car il faudra donc rajouter directement en HTML une balise qui ne servira qu'à la mise en page?

Malheureusement parfois on ne peut pas se passer de "divs" intermédiaires qui ne servent qu'à la mise en page...

le div global devrait avoir un background green

Oui, le div "#glob" a un background vert. Sauf que ce div a une hauteur de zéro, étant donné que son contenu ce sont deux flottants. Un flottant est fait pour "sortir" du flux de texte, du coup il n'y a plus de flux de texte dans ton div "#glob", qui a donc une hauteur nulle. Tu peux d'ailleurs remarquer aussi que l'ombre de ce div (box-shadow) est caché par le background du div #main"...

Dernière modification par tiramiseb (Le 16/03/2013, à 16:49)

---

Sébastien Maccagnoni - https://www.maccagnoni.eu - https://www.domotego.com

untitledoc

Re : HTML-CSS:question bonne pratique et problème pour donner une propriété

Ok merci
Mais alors comment faire pour faire une div global de deux elements flottants?

tiramiseb

Re : HTML-CSS:question bonne pratique et problème pour donner une propriété

Par définition, on ne peut pas avoir un élément visuel contenant un élément flottant. Sinon ça ne serait plus un élément flottant

Ton but c'est quoi ? Avoir deux div côte à côte ?
Largeur dynamique ou statique ?

---

Sébastien Maccagnoni - https://www.maccagnoni.eu - https://www.domotego.com