Centrer une frame

[scoubi77]

Bonjour à tous,

J'aurais besoin d'un coup de main pour obtenir
Le résultat que je souhaite obtenir .
J'ai deux frames, colone gauche de 30% et colone
Droite 70 %.
Sur la colone de gauche j'ai un menu de 130px en largeur
Centrer vers la droite et Sur la colone de droite un contenu de 600 px de largeur
Centrer vers la gauche de façon à obtenir un menu collé
À un contenant .
Mon soucis je voudrais centrer au milieu de l'écran de tout
Mes visiteurs!!!!!
J'ai fait des recherches on peut faire des div en css,
Mais après il faut du php pour activer les liens donc j'ai
Abandonné.
Quelqu'un aurait une solution?
Merci par avance
Amicalement scoubi 77

[NoSmoking]

Bonjour,
http://www.developpez.net/forums/d11...e/#post6418145

[Torgar]

Même question qu'ici non ?

Soit :

• iframe HTML
• include PHP
• jQuery.load() Javascript

Une fois ceci déterminé, on pourra t'aider.

Envoyé par scoubi77

Bonjour à tous,

J'aurais besoin d'un coup de main pour obtenir
Le résultat que je souhaite obtenir .
J'ai deux frames, colone gauche de 30% et colone
Droite 70 %.
Sur la colone de gauche j'ai un menu de 130px en largeur
Centrer vers la droite et Sur la colone de droite un contenu de 600 px de largeur
Centrer vers la gauche de façon à obtenir un menu collé
À un contenant .
Mon soucis je voudrais centrer au milieu de l'écran de tout
Mes visiteurs!!!!!
J'ai fait des recherches on peut faire des div en css,
Mais après il faut du php pour activer les liens donc j'ai
Abandonné.
Quelqu'un aurait une solution?
Merci par avance
Amicalement scoubi 77

[scoubi77]

Merci Torgar,
Mais j'ai essayé avec le php sans succé
Pouriez vous m'en dire plus sur les iframes,
Comment peuvent elles m'aider par rapport à ce que
Je souhaite faire?

Merci par avance
Amicalement scoubi77

[NoSmoking]

Envoyé par scoubi77

Pouriez vous m'en dire plus sur les iframes,

un minimum de recherche http://www.w3.org/TR/html4/present/f...ml#edef-IFRAME

[scoubi77]

merci NoSmoking,

je sais faire une recherche, je voulais seulement dire que pourais m'apporter
les iframes par rapport a vos expériences ? un centrage ?

torgar je pense que le plus simplepour moi serait les iframes non ?


amicalement scoubi77

[scoubi77]

J'ai crée deux iframes, une gauche et l'autre droite.

Je suis perdu comment maintenant les coller en deux colones gauche et droite ?
j'ai une largeur de menu de 135 px et un contenant de 600 px en droite, il faut que je lui demande de me faire ?

Code :

1
2
3
4
5
 
<iframe name="gauche" src="gauche.htm" width="135" height="100%"  border="0" frameborder="NO" ></iframe>
<iframe name="droite" src="droite.htm" width="600" height="100%"  border="0" frameborder="NO"></iframe> 
 
width="135" height="100%" et width="600" height="100%"

comment maintenant les centrer pour obtenir ce que je souhaite ?

Merci pour vos aides

[Torgar]

Code :

1
2
3
4
5
<div style="width: 735px; margin-left: auto; margin-right: auto;">
    <iframe name="gauche" src="gauche.htm" style="width: 135px; height: 100%; border: none; float: left;" frameborder="NO" ></iframe>
    <iframe name="droite" src="droite.htm" style="width: 600px; height: 100%; border: none; float: left;" frameborder="NO"></iframe>
    <div style="clear: both;"></div>
</div>

Normalement, ca sera centré avec tes deux iframe cote à cote (non testé).

[scoubi77]

un div !!!!
je suis idiot !!!
merci par contre je n'ai que les 2/3 haut de chaque iframe
parcontre elles ont l'air de ce centrer.
ça vient d'ou ce problème de taille ?

merci

[Torgar]

Du height à 100% qui ne s'applique pas.

Fait une recherche ici et sur Google, le sujet a déjà du être traité par nos semblables ^^

[scoubi77]

merci je regarde

[scoubi77]

c'est galère,

il me reste que le php avec du css comme option non ?
mais avec le php j'avais l'ouverture dans une autre fenetre
je vais essayer pour demain de re prendre avec le php
et re poster demain soir

Merci

[NoSmoking]

Envoyé par scoubi77

c'est galère,

comme description du problème rencontré on a vu mieux, et nous on rame.

Qu'est ce qui coince...?

[Torgar]

Que se soit du php et CSS ou HTML et CSS le problème sera toujours le même. La c'est clairement du CSS a mon humble avis.

Donne nous le code complet de ta page et joins une image pour nous montrer ce que tu souhaites vraiment au pire. La on sera en mesure de t'aider correctement.

Ps: désolé pour les accents manquants. Envoyé depuis mon téléphone....

[scoubi77]

Je rentre ce soir de ma garde et j'envois tout cela , merci
Ps: comment fait on pour mettre une image sur le forum ?

[scoubi77]

bonsoir,

voici un screen du site que je fais pour un ami ( sur mon écran bien centré ) fait avec deux frames




voici mon code page gauche le menu:

Code :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
 
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<TITLE>nav</TITLE>
<html>
 
 
<style type="text/css"> 
<!-- 
a { 
text-decoration: none; 
color:#000000;
} 
//--> 
</style> 
 
 
 
<meta name="description" CONTENT="">
<META HTTP-EQUIV="IMAGETOOLBAR"CONTENT="no" MARGINWIDTH=0 MARGINHEIGHT=0 FRAMEBORDER="no" SCROLLING="no" FRAME NORESIZE >
 
<META NAME="keywords" CONTENT="">
</HEAD>
<!-- DEBUT DU SCRIPT --><SCRIPT LANGUAGE="JavaScript">
 
function yaunclick()	{	alert('reproduction interdite');	}function noclick(scx)	{
 
	if (navigator.appName == "Netscape" && scx.which == 3)		{		yaunclick();
 
		return false; 		}
 
if (navigator.appVersion.indexOf("MSIE") != -1 && event.button == 2)		{
 
		yaunclick();		return false; 		}	}document.onmousedown = noclick</SCRIPT>
 
<!-- FIN DU SCRIPT -->
 
<script language="JavaScript1.2">
function refresh()
  {
  document.location.reload();
                return false;
  }
document.oncontextmenu = refresh;
</script> 
<script type="text/javascript">
<!--
function removeelements(){
  var remove_el=document.all.remove
  if (remove_el!='' && remove_el.length==null){
    remove_el.style.display='none'
  }else{
    for (i=0;i<remove_el.length;i++){
      remove_el[i].style.display='none';
    }
  }
  document.bgColor="white";
  document.body.style.background='';
}
 
function revertback(){
  setTimeout("window.location.reload()",50);
}
window.onbeforeprint=removeelements;
window.onafterprint=revertback;
 
// -->
</script> 
<style type="text/css">
                body { 
 
                        background: #FFFFFF; 
                        color: #000000;
			font-family: Helvetica, Arial, sans-serif;
 
                }
 
 
        .cti {
                        width: 130px;
                        background: #D3D3D3;
                        border-radius: 20px;
                        padding: 20px;
                        margin: 40px auto;
			box-shadow: 0 0 20px #222;
 
                }
        .ctu{
                        width: 130px;
                        background: #D3D3D3;
                        border-radius: 20px;
                        padding: 20px;
                        margin: 0px auto;
			box-shadow: 0 0 20px #222;
 
                }
        </style> 
 
 
  <BODY>
<div  class="body">
  <div style="float:right;" class="cti">
<p align="center"><FONT face="Verdana" size="2" color=""><A HREF="droite.htm" target="droite" TITLE="accueil" >Accueil </A></FONT></P>
<p align="center"><FONT face="Verdana" size="2" color=""><A HREF="asso.htm" target="droite" >L’association</A></FONT></P>
<p align="center"><FONT face="Verdana" size="2" color=""><A HREF="deroulement.htm" target="droite" >  Déroulement du week-end
  à thèmes</A></FONT></P>
<p align="center"><FONT face="Verdana" size="2" color="">Hébergement</FONT></strong></P>
<p align="center"><FONT face="Verdana" size="2" color=""><A HREF="mad.htm" target="droite" > Les matériels <br/> à disposition</FONT></A></P>
<p align="center"><FONT face="Verdana" size="2" color=""><A HREF="iftech.htm" target="droite" > Infos techniques </FONT></A></P>
<p align="center"><FONT face="Verdana" size="2" color=""> Votre équipement <BR>à 
prévoir</FONT></P>
<p align="center"><FONT face="Verdana" size="2" color=""> Tarifs</FONT></P>
<p align="center"><FONT face="Verdana" size="2" color=""> Les week-ends
vus par les <BR>participants</FONT></P>
<p align="center"><FONT face="Verdana" size="2" color=""> Location du site <BR>à la semaine</FONT></P>
<p align="center"><FONT face="Verdana" size="2" color=""> Mes images</FONT></P>
<p align="center"><FONT face="Verdana" size="2" color=""><A HREF="village.htm" target="droite" > Le village</FONT></P>
<p align="center"><FONT face="Verdana" size="2" color=""> Me contacter</FONT></P>
</div>
 
</BODY>
</html>

page droite

Code :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="description" CONTENT="">
<meta HTTP-EQUIV="IMAGETOOLBAR" content="no" SCROLLING="yes" >
<meta name="keywords" CONTENT="">
<!-- DEBUT DU SCRIPT -->
<script type="text/javascript">
 
function yaunclick(){	
	alert('reproduction interdite');
	}
function noclick(scx){
	if (navigator.appName == "Netscape" && scx.which == 3){
		yaunclick();
		return false;
	}
 
	if (navigator.appVersion.indexOf("MSIE") != -1 && event.button == 2){
		yaunclick();
		return false;
	}
}
document.onmousedown = noclick;
 
function refresh()
  {
  document.location.reload();
                return false;
  }
document.oncontextmenu = refresh;
 
<!--
function removeelements(){
  var remove_el=document.all.remove
  if (remove_el!='' && remove_el.length==null){
    remove_el.style.display='none'
  }else{
    for (i=0;i<remove_el.length;i++){
      remove_el[i].style.display='none';
    }
  }
  document.bgColor="white";
  document.body.style.background='';
}
 
function revertback(){
  setTimeout("window.location.reload()",50);
}
window.onbeforeprint=removeelements;
window.onafterprint=revertback;
 
// -->
</script> 
<!-- FIN DU SCRIPT -->
<style type="text/css">
	body { 
		width:69%
 
                background: #FFFFFF; 
		color: #000000;
		font-family: Verdana;
	}
	h1 { 
		font-size:1.8em;
	}
	#entete {
		text-align: center;
		width: 605px;
		background: #D8BFD8;
		border-radius: 20px;
		padding: 20px;
		margin: 40px auto;
		box-shadow: 0 0 20px #222;
	}
	#corps {
		width: 605px;
		background: #FFFACD;
		border-radius: 20px;
		padding: 20px;
		margin: 40px auto;
		box-shadow: 0 0 20px #222;
	}
	#piedDePage {
		width:600px;
		background: #A6D2FF;
		border-radius: 20px;
		padding: 20px;
		margin: 0px auto;
		box-shadow: 0 0 20px #222;
	}
	p {
		text-align: left;
	}
</style> 
</head>
 
<body>
<div style="float:left;" id="centrage">
    <div id="entete">
    	<FONT face="Garamond" size="3"><h1>OBSERVATOIRE ASTRONOMIQUE DE BAUDUEN (83630)</h1></FONT>
    </div>
    <div id="corps"><FONT face="Verdana" size="2">
    	<p>L'observatoire astronomique de Bauduen situ&eacute; dans le Haut Var, au c&oelig;ur du Parc du Verdon, organise des week-ends &agrave; th&egrave;mes : Astronomie ; Photographie ; Randonn&eacute;e. L'h&eacute;bergement se r&eacute;alise sur place, se qui facilite les observations nocturnes du ciel. </p>
        <p>Les animations ont &eacute;t&eacute; mises en place par Olivier PLANCHON, animateur scientifique. Olivier a travaill&eacute; pour diverses centres d'astronomie ; le Conseil R&eacute;gional ; Le CCSTI de Marseille ainsi que sur le site de Bauduen pendant 7 ans de 1991 &agrave; 1998.</p>
        <p>Il y aura des animations en p&eacute;riode estivale suivant la disponibilit&eacute; des logements du site qui sont mis chaque ann&eacute;e en location saisonni&egrave;re.</p>
        <p>L'observatoire situ&eacute; loin des lumi&egrave;res des villes et le t&eacute;lescope de classe semi professionnel ultra lumineux mis &agrave; votre disposition, vous permettront de superbes observations des objets c&eacute;lestes.</p>
        <p>Bonnes observations &agrave; tous<br/>La pr&eacute;sidente<br/></p><br/>
       <div style="text-align:center"><img src="image/image.jpg"  width="197" height="300" border="0" ></DIV> <BR>
        T&eacute;lescope &Oslash; 62 cm ouvert &agrave; F/D : 3,3 et 20 Newton / Nasmith, sur monture &agrave; fourche. Moteurs pas &agrave; pas, entrainement en &#x1F71; par couronne dent&eacute;e.Masse de 1300 kg. Construction : Olivier PLANCHON. Optiques de Dany CARDOEN, T&eacute;lescope sous coupole de &Oslash; 5 m&egrave;tres.<br/>
         </P></FONT>
    <BR><BR><BR>
                       <div style="text-align:center"><FONT face="Verdana" size="1">Copyright © 2012 - Olivier Planchon / BAUDUEN / France 
                     Tous drois reserv&eacute;s - All rights reserved - Informations l&eacute;gales - Legal info</DIV></FONT>
    </div>
</body>
</html>

merci

[Torgar]

Et ce n'est pas le résultat voulu ?

J'avoue comprendre de moins en moins...

[scoubi77]

oui mais uniquement chez moi je l'ai testé sur 4 pc différents avec des écrans différents et il n'y a que le mien qui est centré !!! sur les autres ça tire sur la droite

[NoSmoking]

le plus intéressant est ce que tu ne nous montres pas, à savoir la page qui contient les IFRAMEs et le style associé.

[Torgar]

Envoyé par NoSmoking

le plus intéressant est ce que tu ne nous montres pas, à savoir la page qui contient les IFRAMEs et le style associé.

Je compléterai la liste en demandant les navigateurs et versions utilisées pour les tests. Merci ^^