Centrer un div dans un autre div...

[Don_Angelo 27]

Bonjour à tous,

Je procède actuellement à la refonte graphique de mon site internet. Et j'ai un petit problème de CSS. En fait j'utilises une série div imbriqué les uns dans les autres.

http://perso.numericable.fr/~dondavid/

Ce que j'aimerais c'est que le div "header" soit centré a l'interieur du div "page" Mais impossible d'y arriver. J'ai pourtant tout essayé mais impossible, seul I.E comprend ce que je veux. Firefox me le colle à gauche. Dans le meilleur des cas il me le colle complètement à droite. Le pire c'est qu'à un moment j'avais presque trouvé mais je me rapelle plus comment j'avais fait. Quelqu'un peut il m'aider? D'avance Merci.

PS: j'ai essayé les techniques données sur alsacréation,ainsi que d'autres vues sur le net mais aucune ne semble convenir à mon problème.

[Gu ! 0]

Ca marche de cette façon là :

#header
{
width:750px;
margin-right: auto;
margin-left: auto;
margin-top:10px;
background: #f0cd7d;
}

Par contre, je ne sais pas ce que ça donne sous IE, étant donné qu'il n'a pas l'extention Web Developper... :oups

[Don_Angelo 27]

Gu je te remercie mille fois. Sous IE ça passe puisque j'ai mis text-align:center; pour body.

[tbr 13]

Il existe des hacks CSS pour IE. Voir Google pour cela.

[Don_Angelo 27]

Voilà j'ai presque terminé. En toute sincérité vous trouvez ça coment?

[Gu ! 0]

tbr> De toutes façons, IE, çaymal.

Don_Angelo> C'est plutôt joli et sobre. J'aime bien.

En plus, c'est valide XHTML strict, quoi de mander de plus ?

Par contre, pourquoi spécifier le curseur sur les images ? Ca donne l'impression qu'on peut cliquer alors que non.

[Wizmaster 0]

Aaaaaaaaaaaaaaaaaaaaaaaaaaaaaargh ! Couic ! X_x

Moi qui passait plus ici, vous ne m'avez rien pardonné...

tbr > Les hack CSS pour IE CAY TRAY MAL ! TRAY TRAY TRAY MAL ! Avec l'arrivée de IE7, les inconditionnels du "star hack" se mordent les doigts et c'est bien fait pour leur gueule. Il faut utiliser des conditional comments ! Ils sont fait pour ça quand même !

http://msdn.microsoft.com/workshop/author/dhtml/overview/ccomment_ovw.asp

http://www.456bereastreet.com/archive/200511/valid_downlevelrevealed_conditional_comments/

Don_Angelo & Gu ! > Quoi demander de plus ? Ca a beau être valide XHTML, c'est daubesque. Quoique avec l'experience je n'accorde plus aucune importance à cet espèce de badge de bonne conduite. La preuve en image par Don_Angelo :

C'est quoi ça ? Une horreur sémantique !!! c'est fait pour les loosers ?

CSS:Créer Son Site

T'es au courant que

peut aussi porter des attributs ?

Dans le CSS le style, dans le CSS !

Quand aux règles CSS, j'ai abandonné passé la 5ème ligne, c'est illisible.

Pour un site qui prétend donner les clés pour "Créer son site" avec astuces et tout le toutim, ça fait cheap je dois dire. Bref, être valide XHTML n'empêche pas de pondre du code tout ce qu'il y a de plus merdique au vu de l'état de l'art actuellement.

[tbr 13]

Wizmaster > bô, t'as raison, c'est la flemme de ne pas utiliser les commentaires [if machin-chose].

Du coup, va falloir que je retrifouille dans mon CSS pour éradiquer les hacks fonfons.

Aaah, le web sémantique !... Ou, comnent larguer les codeurs du dimanche ?

[Don_Angelo 27]

Aaaaaaaaaaaaaaaaaaaaaaaaaaaaaargh ! Couic ! X_x

Moi qui passait plus ici, vous ne m'avez rien pardonné...

tbr > Les hack CSS pour IE CAY TRAY MAL ! TRAY TRAY TRAY MAL ! Avec l'arrivée de IE7, les inconditionnels du "star hack" se mordent les doigts et c'est bien fait pour leur gueule. Il faut utiliser des conditional comments ! Ils sont fait pour ça quand même !

http://msdn.microsoft.com/workshop/author/dhtml/overview/ccomment_ovw.asp

http://www.456bereastreet.com/archive/200511/valid_downlevelrevealed_conditional_comments/

Don_Angelo & Gu ! > Quoi demander de plus ? Ca a beau être valide XHTML, c'est daubesque. Quoique avec l'experience je n'accorde plus aucune importance à cet espèce de badge de bonne conduite. La preuve en image par Don_Angelo :

C'est quoi ça ? Une horreur sémantique !!! c'est fait pour les loosers ?

CSS:Créer Son Site

T'es au courant que

peut aussi porter des attributs ?

Dans le CSS le style, dans le CSS !

Quand aux règles CSS, j'ai abandonné passé la 5ème ligne, c'est illisible.

Pour un site qui prétend donner les clés pour "Créer son site" avec astuces et tout le toutim, ça fait cheap je dois dire. Bref, être valide XHTML n'empêche pas de pondre du code tout ce qu'il y a de plus merdique au vu de l'état de l'art actuellement.

Ai-je dis que c'était terminé? Ce n'est qu'un premier jet, je n'ai pas la précaution de pondre un code parfait du premier coup contrairement à certains.

ça comme tu dis c'est la technique du nifty corner pour produire des coins arrondis sans utiliser d'image. Je trouve particulièrement mesquin de s'attaquer à un travail inachevé.

Un détail comme ça, je suis pas obligé de coller des attributs à H1, dans la recommandation CSS2 tout les exemples de balises H1 sont donnés sans attributs, de plus, j'ai, toujours conformément à cette même recommandation, déclaré une règle spécifique à H1 dans ma feuille de style.

Pour ce qui est de l'horeur sémantique je te rappelle au passage que et ne sont pas des balises propriétaires, et donc conformes à la recomandation XHTML 1.0 Strict.

Pour ce qui est des hacks CSS je te rappelle encore qu'ils sont recommandés dans le HS n°3 de code®, spécial programmation web. Chacun son école.

Autre chose, encore, je trouve particulièrement malvenu de ta part d'attaquer mon code tout en sachant que tu n'as pas codé toi même ton site, et que tu as installé un truc téléchargé sur le net en deux minutes et dont tu t'appropries le mérite.

[Wizmaster 0]

Don_Angelo > Haha. Génial. Et en plus ça se permet ces remarques. Alors, point par point :

* Je m'attaque à du travail non-fini : Si je cite Gu "En plus, c'est valide XHTML strict, quoi de mander de plus ?" et là je m'étouffe. Que ce ne soit pas fini, je le comprends, mais qu'on se paye le plaisir de mettre "valide XHTML" en pondant de la daube en boite, je trouve ça pas mal.

* nifty corner et horreur d'usage du : Je t'invite fortement à regarder la norme et à voir que le tag est un "Font style elements" permettant le fait suivant "Renders as bold text style.". Le est quand à lui un "Grouping elements" permettant "The DIV and SPAN elements, in conjunction with the id and class attributes, offer a generic mechanism for adding structure to documents. These elements define content to be inline (SPAN) or block-level (DIV) but impose no other presentational idioms on the content. Thus, authors may use these elements in conjunction with style sheets, the lang attribute, etc., to tailor HTML to their own needs and tastes."

Si tu vois pas la différence, je crois qu'on va pas beaucoup avancer. Alors avant de se la jouer grand seigneur du XHTML, on regarde la norme et on apprend ce que c'est que le web sémantique. Après seulement, tu pourra te permettre de disserter dessus, et même sur les balises "propriétaires" (pour ... genre...)

Bravo au fait pour l'utilisation hasardeuse d'une "recette" maman gateau alsa qui fait des petits bords ronds. T'avais même pas compris ce que tu faisais.

* balises sur h1 : t'es vraiment débile ou quoi ? Réflechi fortement et demande toi si il était pas plus simple d'écrire

? Oui oui, h1 peut avoir des attributs. (bravo pour avoir confondu attributs et règles CSS)

* hack CSS : ils reposent sur une erreur d'interprétation du navigateur, que se passe-t-il quand l'erreur est corrigée (ie. entrée en service d'IE7) ? Si avec ça t'arrive pas à voir que c'est fondamentalement mauvais de s'en servir...

* mon site : je l'ai pondu il y a 2 ans, j'ai aidé au dev de IPB 2.0 en faisant du débugage et en envoyant des patchs pendant plusieurs mois, j'ai refondu des pans entiers du système pour aller à mon gout, j'ai développé de nouveaux modules, et j'ai donc une connaissance assez étendu (allez, soyons fous, exhaustive) du moteur sous-jascent. Autant pour le téléchargé en 2 minutes et le mérite approprié (d'ailleurs, je me cite "Powered by Invision Power Board v2.0.0 - Modified version by Wizmaster", je ne vois pas ce que je m'approprie)

Au vu de tout celà, je déclare que tu es un con.

[akira 0]

Hum, Wiz qu'appelles tu le "web sémantique" ?

[Gfx 0]

C'est quand écris le code de ta page XHTML avec uniquement des balises qui ont une sémantique et non une signification relative à la mise en page. Par exemple une balise signifie "mettre en gras". Cela n'apporte aucune information, c'est uniquement visuel. A l'inverse si j'utilise la balise (pour emphasize, traduit à l'écran par du gras par la plupart des navigateurs) cela signifie "mettre l'accent sur", comme si tu changeais de ton en parlant. Cela peut se traduire par un souligné, du gras, un changement de casse ou de taille de police ou même par une hausse de volume sur une terminal vocal.

[akira 0]

Ok ok merci . Je vois plus l'intérêt de la chose maintenant ^^.

[Wizmaster 0]

En fait est généralement rendu en italique sur la plupart des plateformes C'est qui passe en gras. Enfin ça c'est par défaut, après c'est une affaire de CSS.

Pourquoi avoir deux balises pour mettre en exergue un élement ? La question reste ouverte même maintenant : http://www.cs.tut.fi/~jkorpela/html/em.html Pour ma part, j'utilise pour ce qui est "clé" et pour quand je veux faire resortir un élement mais qui n'est pas individuellement representatif.

Pourquoi tenter de rester sur du web sémantique ? Imaginons un lecteur d'écran (pas très intelligent certes) qui dit "en gras" quand il voit un élement stylisé en gras. Que va-t-il se passer quand il lira ... ?

[tbr 13]

D'autre part (non négligeable) - et dit entre les lignes par Wizmaster et Gfx -, le Web sémantique permet aussi une lecture du code plus sensée, d'où le sémantique, d'ailleurs. On pourrait presque (ou carrément) dire que "cela coule de source" tandis qu'avec des successions de et autres mises en forme sans ..., on ne distingue plus les formes de type titrailles, paragraphes, mise en exergue, etc. Tout devient un fouillis imbit**ble et illisible parce que anormalisé (= privé de norme)

[Gfx 0]

Wizmaster : Ouhla oui pardon ^^

Cela dit je tiens quand meme a preciser que le developpement a coups de divs de partout c'est loin d'être la panacee. Il y a encore beaucoup de problemes et de deficiences, notamment sur le redimensionnement des pages web (ce qui explique en partie pourquoi tant de site ont une colonne fixe au milieu ^^).

[TerJe 0]

tout cela biensur si on assimile le html/css a de la programmation plutot qu a de la simple mise en page qui ne meriterait pas des débats aussi violents :devil :devil :devil

ok ok --------->[]

[Gfx 0]

De la "simple" mise en page ? Tu devrais consulter quelques livres sur le sujet et tu verrais si les débats ne pourraient pas être aussi "violents".

[TerJe 0]

oui d'accord , je rigole , mais de la à se traiter de con pour savoir si on utilise h ou div pour centrer une image sur un écran y a un peu d'abus non ?

Recentrons le sujet , je pense que don_angelo a poster pour avoir un avis pas pour se faire traiter de con c'est tout !

[Gfx 0]

C'est le style des forums depuis des années, tu le changeras pas

[Wizmaster 0]

TerJe > Je ne l'ai pas traité de con du premier coup, j'ai été assez aggressif dès le début (comme je l'explique d'ailleurs) quand j'ai lu la réponse de Gu. Ca faisait vraiment "Regardez ! Je viens de faire dans mon pot ! *fier* *fier*" En plus que c'était typiquement le genre de truc qui m'énerve, il ne suffit pas de passer le validateur de DTD pour pondre du code valide. (parce que justement il ne valide que la DTD, pas la sémantique) C'est plutôt sa réponse après qui m'a motivé pour le "con", surtout me sortir tout son blabla sur mon site fait il y a plusieurs années.

[Technogreg 0]

j'avoue que je vous comprends pas, il demande et avis et tu lui tombe dessus parce que soit disant tu sait tout mieux que tout le monde. Si son site ne t'inspire pas de bonnes choses, évite de le dire.

Wiz tu vient de passer pour un petit prétentieux sans interêt, dont la jouissance ne vient que du seul fait de dire, "ce n'est sémantiquement pas correct, alors tu es un nul".

Certes posse était un forum ou les nouveaux avaient du mal à s'intégrer car les caractères des membres était ... ce qu'il est va t-on dire, mais là tu fait plus que fort, sur ce je ne m'attarde pas plus sur ce topic qui grâce à toi n'as plus d'interêt.

[Don_Angelo 27]

Merci à ceux qui ont tenté de me défendre.

Bon alors je vais te répondre franchement tu es loin d'avoir cerné ma personne alors évites de me traiter de con à l'avenir, aujourd'hui je suis de bonne humeur alors je ferais l'impasse la dessus pour cette fois.

Si tu veux jouer les malins allons y. Premièrement si j'ai mis le logo c'est pour une seul et unique raison: pour mettre en forme le pied de la page, et pour la même occasion demander l'avis de mes colaborateurs. Sache pour info que j'ai réalisés des tests très précis pour décider de chacun des détails de la charte graphique. De l'emplacement des boutons du menu, à la couleur en paçant par le type et la taille des polices. Ces tests ont révélés pas mal de choses que tu ne trouveras dans aucun livre, aussi bon soit-il. Parce que je ne laisse rien au hasard et que cette technique m'a toujours réussi dans tout ce que j'ai entrepris jusqu'à maintenant. Et c'est pas des affirmations aussi péremptoires et prétentieuses qui vont me faire changer d'avis. Si j'ai préféré utiliser une règle CSS avec la balise

plutôt que de lui coller des attributs c'est parce que j'ai mes raisons, et je n'ai pas envie de m'étendre la dessus.

[Wizmaster 0]

Tu as tout à fait raison mon petit, comme Gu l'as si bien dit, y a rien à rajouter sur ton site, il est proprement parfait.

(PS: Illumine mon esprit prétentieux en m'expliquant la raison pour avoir collé le

dans un

inutile ? Juste pour rire)

[Sylario 0]

Haha magnifique un logo 56k avec juste l' image titre de 85 ko, du grand art.