28220 sujets

CSS et mise en forme, CSS3

Avant tout, merci d’avance d’avoir pris le temps de me lire.
Voici les faits :
J’ai crée un cadre général d’une largeur fixe, qui est centré au milieu du navigateur (IE, Firefox, Opéra....) dont voici la CSS :
J’ai utilisé la position relative pour un positionnement aisé du centrage du cadre.


#cadrage {
	position : relative;
	width : 950px;
	height : 800px;
	margin : 0 auto;
	background : url('body/background.png') no-repeat;
}


J’ai donc mis tout le reste du contenu du site à l’intérieur de ma div cadrage

<div id= »cadrage »>
	Blabla
Blabla
Blabla
Blabla
blabla
blabla
</div>


A partir de là, je n’ai utiliser que des positionnement absolute pour placer de part et d’autre tous mes blocs aux différents endroits adéquates.
Effectivement tout est propre et aucun problème sous les différents navigateurs testés.

Bref, plus tard un ami ma dit que j’utilisais la position absolute beaucoup trop souvent et à tord, et m’a inviter pour mon convaincre d’utiliser le navigateur W3C Amaya.
Et effectivement, avec ce dernier, toutes mes positions sont mises n’importes ou n’importe comment.

En conclusion, existe-t-il une autre méthode plus adapté ou faut il que je reste sur de l’absolutisme ?

Merci
Administrateur
Hello,

Comme tu peux le lire dans cet élément de la FAQ :
FAQ a écrit :
Le positionnement naturel (en flux) des éléments est à préférer dans tout les cas et autant que possible (surtout pour les contenus).
Il ne faut se tourner vers les autres cas que lorsque le positionnement en flux n'est pas réalisable (éléments côte à côte, etc.) ou pour les grandes zones de la page


Pour ma part, j'essaye autant que possible de suivre ce principe.
Erad a écrit :
Bref, plus tard un ami ma dit que j&#8217;utilisais la position absolute beaucoup trop souvent et à tord, et m&#8217;a inviter pour mon convaincre d&#8217;utiliser le navigateur W3C Amaya.


L'ami en question a tout à fait raison pour ce qui est de la sur-utilisation de la position absolue. Le plus souvent, la mise en page global gagne à privilégier dans l'ordre : le flux, le display-table, les inline-blocks, les flottants, et le positionnement en dernier.

Mais cet ami a en revanche commis une énorme sottise en te renvoyant à Amaya, dont l'implémentation CSS2.x est encore très partielle et bugguée. Ce n'est en aucun cas un navigateur de référence. En fait, ce n'est pas un navigateur, d'ailleurs. C'est un éditeur doté de fonctionnalités de navigation (limitées).
Modifié par Laurent Denis (11 Nov 2005 - 10:30)
Merci pour les réponses...
Maintenant si je m'en réfère à ce lien, je peut donc sans aucun souci placer mon entête, menu, conteneur et pied de page en position absolue ?

Bien évidemment le reste étant travaillé sur de la marge int/ext...

Et si c'est bien le cas, c'est donc exactement ce que j'avais fait, et je vais pouvoir ainsi continuer en veillant à ne pas déraper pour en abuser. Smiley smile
Modifié par Erad (11 Nov 2005 - 18:58)
Administrateur
Erad a écrit :
Merci pour les réponses...
Maintenant si je m'en réfère à ce lien, je peut donc sans aucun souci placer mon entête, menu, conteneur et pied de page en position absolue ?

Euh ben... oui tu peux, mais tu as bien suivi toutes les recommandations qui te conseillent vivement de rester dans le flux naturel autant que possible, n'est-ce pas ?
Raphael a écrit :

Euh ben... oui tu peux, mais tu as bien suivi toutes les recommandations qui te conseillent vivement de rester dans le flux naturel autant que possible, n'est-ce pas ?


Heu... je pense oui, sauf si je n'ai pas très bien compris le "principe" du flux naturel.

Un petit tour ici, (te prenant 5sec de ton temp Smiley cligne ) peut, peut être t'éclairer, sur ce que j'essaye de faire.

Ce qu'il me fait peur, c'est si je décide de changer les formes (aspects, design dimension) des blocs menus ou autre, toute ma page s'en retrouve chamboulé.
Sachant qu'il n'y a que le contenu que je veuille changer (les infos, news.) où j’utilise que du marge et padding, la position absolue sur le reste et qui ne bougera plus me paraissait la plus approprié. Maintenant et j’en suis quasiment sûr en te lisant, il y a forcement quelque chose que je ne doit pas savoir encore faire correctement. Je n'ai pas encore étudié les fonctions "display-table, inline-blocks"... Bref, comme le dit ma signature, tant de chose à apprendre...

Ps: le site étant en construction, je me suis permi de prendre des bouts de phrases, du site Alsa pour remplir mes news.. Merci à toi donc Smiley smile
Modifié par Erad (11 Nov 2005 - 19:37)
Administrateur
Bonjour,

une fois que tu as fixé les positions des grandes parties de ton site les unes par rapport aux autres, tu peux y faire ce que tu veux sans que ça fiche en l'air le design général (à part modifier ce qui les positionne bien sûr, mais il n'y a plus de raison vu que c'est fait)
Le menu à gauche peut être 2 fois plus large, le contenu à sa droite continuera à être "à sa droite" en positionnement flottant/relatif. Avec un positionnement absolu, si les 150 px du menu de gauche deviennent un jour 300 px, il ne faut surtout pas oublier de modifier également le contenu qui est à 151 px pour le placer à 301 px sinon tout se recouvre ... Et s'il y a plusieurs contenus ou du contenu encore plus à droite, mmh une partie de plaisir Smiley confus

EDIT: http://www.lipsum.com pour du texte générique bouche-trou Smiley smile
Modifié par Felipe (11 Nov 2005 - 19:57)