probleme centrage page dreamweaver helpppppppp

probleme centrage page dreamweaver helpppppppp - Web design - Graphisme

Marsh Posté le 24-11-2005 à 23:47:50    

salut a tous je viens de me mettre a dreamweaver et j ai une question a poser quelqu un  serais comment faire pour que ma page ce centre automatiquement car quand je reduit le coin de ma fenetre avec la souris, mon site reste a la meme place j aimerai qu il suive la page comme tous les site exemple :  http://www.tchatche.com sur ce site la fenetre se recentre au fur et a mesure moi le miens non www.fxs3d.com aidez moi svppppppppppp

Reply

Marsh Posté le 24-11-2005 à 23:47:50   

Reply

Marsh Posté le 24-11-2005 à 23:50:43    

pour chaque div t'as fixé la taille en pixels c'est normal qu'il redimensionne rien [:spamafote]. vaut mieux mettre la taille en %.

Reply

Marsh Posté le 24-11-2005 à 23:58:46    

je vois pas ou on fait ca j aimerai que ma page reveinne j ai creer un cadre calque pour exemple mais je vois pas ou on fait ce que tu me dit pour que ca reveinne

Reply

Marsh Posté le 25-11-2005 à 00:02:50    

j ai fait un test en mettant en pourcentage mais ca s allonge et se retrecit j aimerai que ca ce deplace juste et que ca garde la meme largeur

Reply

Marsh Posté le 25-11-2005 à 18:42:54    

1/ à quoi sert le frameset ? (à part empêcher de voir tout de suite la vraie page, donc d'accéder au code...)  :??:  
 
2/ tu utilise un div : inutile si tu ne met pas tout en css... les accros de la mise en page css vont d'ailleurs hurler en voyant tes balises, du genre :
<p><font face="Courier New" color="white"><span style="font-size:10pt;">MES CREATIONS</span></font></p>
donc, ce calque (div) est en position absolue, ce qui empêche le recentrage automatique, comme avec un simple <table align="center"> (tableau aligné au centre).. sur tchatche.com, ils passent par une sorte de javascript.. pas très catholique tout ça.... :p  
 
3/ je sais que les gens qui naviguent en 800x600 se font rares, mais vu le peu d'éléments à caser dans ta page d'accueil, une largeur plus modeste serait bienvenue (cf : le site tchatche.com)
 
bonne chance...  ;)  
 

Reply

Marsh Posté le 25-11-2005 à 20:22:02    

oki je vois mieux mais moi jaimerais qu il se recentre automatiquement comme tchatche comment doit je faire ????????
 
merci d avance

Reply

Marsh Posté le 26-11-2005 à 01:37:36    

qui peut m aider ca serait sympa car j arrive vraiment pas a savoir comment faire merci d avance..................................

Reply

Marsh Posté le 27-11-2005 à 16:13:01    

si ton bloc conteneur est en position "absolute", essaye ça dans ses attributs :
 
left:50%;
margin-left:-200px;
 
 
le -200px est un exemple. Cette valeur doit être égale à la moitié de la largeur du bloc conteneur, en négatif (donc ici, la largeur était de 400px).

Reply

Marsh Posté le 27-11-2005 à 18:57:54    

Hello,
essaye ca.....
 
dans ton code html:
<body>
<div id="centrage">
...
tout ton code
...
</div>
</body>
 
dans body (ou en CSS) tu rajoute:
margin: 0px;
 
et pour le div "centrage":
margin-left: auto;
margin-right: auto;
position: relative;
 
tu peux t'inspirer de mon site perso si tu veux ;)

Reply

Marsh Posté le 27-11-2005 à 21:53:19    

merci blurb
 
 
 
je suis un peu pommer en fait je sias pas ou je dois deposer cela en fait pour exemple je crer un layer et jaimerai qu il se deplace sur la gauche un peu come tchachte
 
voila mon code ou placer ta formule  
 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Document sans nom</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="JavaScript" type="text/JavaScript">
<!--
function MM_reloadPage(init) {  //reloads the window if Nav4 resized
  if (init==true) with (navigator) {if ((appName=="Netscape" )&&(parseInt(appVersion)==4)) {
    document.MM_pgW=innerWidth; document.MM_pgH=innerHeight; onresize=MM_reloadPage; }}
  else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH) location.reload();
}
MM_reloadPage(true);
//-->
</script>
</head>
 
<body>
<div id="Layer1" style="position:absolute; left:212px; top:120px; width:879px; height:663px; z-index:1; background-color: #FF33CC; layer-background-color: #FF33CC; border: 1px none #000000;"></div>
</body>
</html>
 

 
merci de preter attention a mon probleme en tout cas  
(tu peut me donner ladresse de ton site??????)


Message édité par ryan3d le 27-11-2005 à 22:00:33
Reply

Marsh Posté le 27-11-2005 à 21:53:19   

Reply

Marsh Posté le 28-11-2005 à 05:49:20    

voila le code, en gras les modifs:
 
version sans CSS
code html:
.
.
<body style="margin:0px">
<div id="centrage" style="position:relative; margin-left: auto; margin-right: auto; width:879px; height:663px">
<div id="Layer1" style="position:absolute; left:0px; top:120px; width:879px; height:663px; z-index:1; background-color: #FF33CC; layer-background-color: #FF33CC; border: 1px none #000000;"></div>
</div>  
</body>
.
.
 
version avec CSS
code html:
.
.
<link href="moncss.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="centrage">
<div id="Layer1"></div>
</div>  
</body>
.
.
 
le CSS (à enregistrer sous "moncss.css" à la racine de ton site):
.
body {
 margin: 0px;
}
#centrage {
 width: 879px;
 height: 663px;
 margin-left: auto;
 margin-right: auto;
 position: relative;
 top: 120px;
}
#Layer1 {
 width: 879px;
 height: 663px;
 position: absolute;
 top: 0px;
 left: 0px;
 background-color: #FF33CC;
 border: 0px;
}
 
PS: pour mon site, clique sur l'icone maison à droite de mon pseudo ou alors c'est


Message édité par Blurb le 28-11-2005 à 05:50:53
Reply

Marsh Posté le 28-11-2005 à 22:00:52    

merci ca marche vraiment impeccable je te remercie vraiment pour ton aide  
 
je voudrais pas abuser mais si par exemple j ai plusieur layer l un dessus lautre et que je veut que tous vienne en meme temps je doit indiquer les meme information de margin ect.. atous ou une fois suffit  
 
 
merci ................

Reply

Marsh Posté le 28-11-2005 à 22:10:58    

...


Message édité par ryan3d le 28-11-2005 à 23:42:17
Reply

Marsh Posté le 28-11-2005 à 23:21:05    

...


Message édité par ryan3d le 28-11-2005 à 23:42:25
Reply

Marsh Posté le 28-11-2005 à 23:41:39    

desole de te reembeter mais oublie ce que jai marquer en heur j aimerai savoir pourquoi quand je rajoute se que ta marquer ca decalle mon layer en fait ca crer un cadre gris .... si je deplace mon layer quand je fait lapercu dans explorer ca remet pas totalementa gauche je te montre mon code tu va voir se que ca fait en fait je veut que mon calque soit placé a cette endroit exact  
 
 
j espere que tu sera merci beaucoup  
<body style="margin:0px">  
<div id="centrage" style="position:relative; margin-left: auto; margin-right: auto; width:821px; height:698px">  
<div id="Layer1" style="position:absolute; left:36px; top:18px; width:821px; height:698px; z-index:1; background-color: #FF0000; layer-background-color: #FF0000; border: 1px none #000000;"></div>  
</div>    
</body>  
</html>  
 
comment deplacer cette marge grise essaye la page tu verra le cadre reviens pas au bout a gauche mais j aimerai vraiment que mon lyer sois a cette endroit
 
en fait a chaque fois il me decale mon layer
 
 
 
et comment faire aussi quand je met plusieur layer
<body style="margin:0px">  
<p>&nbsp;</p>
<p>&nbsp; </p>
<div id="centrage" style="position:relative; margin-left: auto; margin-right: auto; width:729px; height:709px">  
<div id="Layer2" style="position:absolute; left:410px; top:63px; width:509px; height:401px; z-index:1; background-color: #FF6699; layer-background-color: #FF6699; border: 1px none #000000;"></div>
<div id="Layer1" style="position:absolute; left:0px; top:0px; width:729px; height:709px; z-index:1; background-color: #3366CC; layer-background-color: #3366CC; border: 1px none #000000;"></div>
</div>
</body>
</html>
 
 
 
-----------------------------------------
 
desolé de pas etre clair en fait voila une page que jai fait avec 3 layers et des lettre jaimerai qu il se centre bien sans bouger de place tous les deux commen faire
 
</head>
 
<body>
<div id="Layer1" style="position:absolute; left:273px; top:22px; width:792px; height:652px; z-index:1; background-color: #6600CC; layer-background-color: #6600CC; border: 1px none #000000;"></div>
<div id="Layer2" style="position:absolute; left:354px; top:52px; width:318px; height:359px; z-index:2; background-color: #CCFF33; layer-background-color: #CCFF33; border: 1px none #000000;"></div>
<div id="Layer3" style="position:absolute; left:806px; top:143px; width:235px; height:413px; z-index:3; background-color: #D4D0C8; layer-background-color: #D4D0C8; border: 1px none #000000;"></div>
</body>
</html>
 

j ai fait ca

 
<body style="margin:0px">  
<div id="centrage" style="position:relative; margin-left: auto; margin-right: auto; width:792px; height:652px">  
<div id="Layer1" style="position:absolute; left:0px; top:22px; width:792px; height:652px; z-index:1; background-color: #6600CC; layer-background-color: #6600CC; border: 1px none #000000;"></div>
<div id="Layer2" style="position:absolute; left:76px; top:60px; width:318px; height:359px; z-index:2; background-color: #CCFF33; layer-background-color: #CCFF33; border: 1px none #000000;"></div>
<div id="Layer3" style="position:absolute; left:548px; top:60px; width:235px; height:413px; z-index:3; background-color: #D4D0C8; layer-background-color: #D4D0C8; border: 1px none #000000;"></div>
</div>
</body>
</html>
 
 
mais le probleme c que ca c que le layer c decaler de 2 cm vers la droite et si je bouge ca reveins pas a fond


Message édité par ryan3d le 29-11-2005 à 00:28:19
Reply

Marsh Posté le 29-11-2005 à 05:38:04    

fixe tes positions en pourcentage, comme ca par exemple:
.
.
<div id="Layer2" style="position:absolute; left:5%; top:60px; width:318px; height:359px; z-index:2; background-color: #CCFF33; layer-background-color: #CCFF33; border: 1px none #000000;"></div>  
<div id="Layer3" style="position:absolute; right:5%; top:60px; width:235px; height:413px; z-index:3; background-color: #D4D0C8; layer-background-color: #D4D0C8; border: 1px none #000000;"></div>
.
.
 

Reply

Marsh Posté le 29-11-2005 à 08:26:25    

1- tu me vires ton code qui commences à sentir trop mauvais.
2-Si cv'est pour un site qui tu utiliseras longtemps essaye de farie quelque chose de plu pro et de plus PROPRE
3- http://css.alsacreations.com/Faire [...] web-en-CSS
tu me lis le lien ci-dessus
et vous m'arrêtez tous vos conneries là, car ca devient pesant de lire du code tout pourri.
4-Pour du codage c'est la catégorie Programmation > HTML/CSS/JS, on vous donnera des solutions propres, pas des trucs bancales (sauf si ya des neu² qui se permettent de répondre à coté de la plaque)

Reply

Marsh Posté le 29-11-2005 à 11:09:47    

remizz a écrit :

si ton bloc conteneur est en position "absolute", essaye ça dans ses attributs :
 
left:50%;
margin-left:-200px;
 
 
le -200px est un exemple. Cette valeur doit être égale à la moitié de la largeur du bloc conteneur, en négatif (donc ici, la largeur était de 400px).


Cette technique pose un problème : si la taille de la fenêtre est inférieure à la taille du bloc centré, alors la partie gauche du bloc va être invisible, elle va partir dans le vide.
 
Vaut mieux utiliser des marges auto : si la fenêtre est plus petite, le bloc se colle à gauche, et ainsi on peut quand-même tout voir

Reply

Marsh Posté le 29-11-2005 à 15:08:45    

gatsusat a écrit :

1- tu me vires ton code qui commences à sentir trop mauvais.
2-Si cv'est pour un site qui tu utiliseras longtemps essaye de farie quelque chose de plu pro et de plus PROPRE
3- http://css.alsacreations.com/Faire [...] web-en-CSS
tu me lis le lien ci-dessus
et vous m'arrêtez tous vos conneries là, car ca devient pesant de lire du code tout pourri.
4-Pour du codage c'est la catégorie Programmation > HTML/CSS/JS, on vous donnera des solutions propres, pas des trucs bancales (sauf si ya des neu² qui se permettent de répondre à coté de la plaque)


 
 
Euuuuuuuh, j'ai pas tout compris là....tu parles pour moi ?
J'pense pas que ma solution (avec ou sans CSS) soit bancale.
A priori Ryan3d choisit la version sans CSS, et alors ? C'est lui qui se fera ch... pour modifier son site, pas toi.
 
 

Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed