Gros problème avec div

Version imprimable

Gros problème avec div : quand je mets un tableau dans la division, il se position vis-à-vis de la page, et non pas de la division.

Quand je mets du texte juste devant lui, le texte apparaît au bon emplacement (juste en dessous du texte vert) mais le tableau apparaît à sa potion actuelle.
Quand je mets du texte sous le tableau, il apparaît sous celui-ci.
Quand je teste les alignements « center » ou autre, il se positionne vis-à-vis de la page…

Je ne sais plus quoi faire !

Page concernée : http://www.biologieindustrie.com/r6p2.htm
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 <div id="content" class="p_r6p1"> <p class="t_r6p1"><img src="img/titre/tr6p2.gif" /></p> <p class="r6p1"><span class="f12">SARL au capital de 285 000€</span><br /> <br /> <table border cellpadding="2"> <tr align="center"> <td rowspan="2"></td> <td colspan="2">31 mars 2007</td> <td colspan="2">31 mars 2006</td> </tr> <tr align="center"> <td>France</td> <td>Export</td> <td>Total</td> <td>Total</td> </tr> <tr align="center"> <td>Chiffre d'affaires</td> <td>1 122 496</td> <td>1 299 143</td> <td>2 421 639</td> <td>1 856 822</td> </tr> <tr align="center"> <td>Résultat courant avant impôts</td> <td>244 952</td> <td>23 327</td> <td></td> <td></td> </tr> <tr align="center"> <td>Bénéfices</td> <td>291 703</td> <td>86 131</td> <td></td> <td></td> </tr> </table> toto; </div>

24/08/2007, 11h29
Lindorie

Heu si tu pouvais mettre ton code en entier ça serait plus simple ! ;)
24/08/2007, 11h31
Madfrix

Bonjour, peux-tu nous faire voir le CSS de ton div STP ?
24/08/2007, 11h35
nefertitia

Mon souci, c’est que ce n’est pas moi qui ais fais ce site, je dois juste compléter les pages…
Je ne sais donc pas où est le CSS.
Pour le code complet, si vous allez sur le lien de la page, vous l’optiendrez en faisant clic droit, puis code. Il est vraiment trop long pour que le mette ici ^^’
24/08/2007, 11h37
Madfrix

Si tu n'as pas accès à ta page CSS "css-styles.css" tu ne vas pas pouvoir faire grand chose...:roll:
24/08/2007, 11h47
nefertitia

Donc le problème viendrai de là… pourquoi le tableau n’et t’il pas comprit dans la div ?
24/08/2007, 11h56
Madfrix

En fait j'ai du mal à te comprendre...

Ton tableau semble bien dans ton div sinon, il ne serait pas aligné à droite dans ta page...

Essaies de retrouver ta page "css-styles.css" et de nous montrer le code relatif à ton div STP.

Voila! la page de style CSS

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
html, body{ margin:0; padding:0; font:11px "Trebuchet MS", Arial, sans-serif; color:#000;}
 
#conteneur{position:relative; width:980px; margin:auto; border:1px solid #1D4C81;}
/*classe conteneur*/
#conteneur.home{ background:url(img/commun/top1.jpg) 0 0 no-repeat;}
#conteneur.r1{ background:url(img/bandeau/bandeau1.jpg) 0 0 no-repeat;}
#conteneur.r2{ background:url(img/bandeau/bandeau2.jpg) 0 0 no-repeat;}
#conteneur.r3{ background:url(img/bandeau/bandeau3.jpg) 0 0 no-repeat;}
#conteneur.r4{ background:url(img/bandeau/bandeau4.jpg) 0 0 no-repeat;}
#conteneur.r5{ background:url(img/bandeau/bandeau5.jpg) 0 0 no-repeat;}
#conteneur.r6{ background:url(img/bandeau/bandeau6.jpg) 0 0 no-repeat;}
 
 
#header{width:980px; height:112px; text-align:center; padding:8px 0 0 0;}
 
/*Navigation*/
#navigation{width:930px; height:27px; padding:0;}
div#navigation ul {padding: 0;margin:0;list-style: none;line-height: 1; font: 12px Trebuchet MS, Arial, Helvetica, sans-serif;}
div#navigation a {display:block;}
div#navigation li {float: left; padding:0; margin:0;}
div#navigation li ul {position: absolute; width:auto; display:none; padding:3px; margin:0 0 0 5px; background:#fff;}
div#navigation li:hover ul, #navigation li.sfhover ul {display:inline; width:170px; z-index:10;}
 
div#navigation .menu1{ margin:0 0 0 50px;}
div#navigation .menu2{ margin:0 0 0 23px;}
div#navigation .menu3{ margin:0 0 0 20px;}
div#navigation .menu4{ margin:0 0 0 18px;}
div#navigation .menu5{ margin:0 0 0 16px;}
div#navigation .menu6{ margin:0 0 0 20px;}
 
div#navigation .ssmenu{color:#4EB9B4; text-decoration:none; width:170px; padding:0 0 0 3px;}
div#navigation .ssmenu:hover{color:#0A50A1; text-decoration:none; width:170px; padding:0 0 0 3px;}
 
/*Content*/
#content{width:980px;}
 
/*home content*/
#content.home{ background:url(img/home/visuel.jpg) 0 0 no-repeat; height:452px;}
#content p.home{ position:relative; top:140px; left:550px; color:#0A51A1; width:400px; font-size:16px; text-align:right; line-height:22px;}
.titrehome{ font-size:25px; color:#4EB9B4;}
 
/*Recherche Clinique*/
#content.p_r1p1{ background:url(img/photos/r1p1.jpg) 100px 50px no-repeat; }
.t_r1p1{position:relative; top:20px; left:310px; width:170px; height:26px;}
.r1p1{padding:50px 0 0 430px; width:500px; height:290px; color:#1D4C81; font:11px Verdana, Arial, Helvetica, sans-serif;}
.r1p3{padding:50px 0 0 430px; width:540px; height:310px; color:#1D4C81; font:11px Verdana, Arial, Helvetica, sans-serif;}
 
#content.p_r2p1{ background:url(img/photos/r2p1.jpg) 570px 60px no-repeat; height:400px;}
.t_r2p1{position:relative; top:20px; left:350px; width:170px; height:26px;}
.t_r2p5{position:relative; top:20px; left:200px; width:170px; height:26px;}
.r2p1{padding:50px 0 0 90px; width:500px; height:290px; color:#1D4C81; font:11px Verdana, Arial, Helvetica, sans-serif;}
 
#content.p_r3p1{ background:url(img/photos/r3p1.jpg) 100px 60px no-repeat; height:400px;}
.t_r3p1{position:relative; top:20px; left:500px; width:170px; height:26px;}
.r3p1{padding:70px 0 0 470px; width:500px; height:200px; color:#1D4C81; font:11px Verdana, Arial, Helvetica, sans-serif;}
 
#content.p_r4p1{ background:url(img/photos/r4p1.jpg) 570px 60px no-repeat; height:400px;}
.t_r4p1{position:relative; top:20px; left:350px; width:170px; height:26px;}
.r4p1{padding:50px 0 0 90px; top:50px; left:90px; width:500px; height:290px; color:#1D4C81; font:11px Verdana, Arial, Helvetica, sans-serif;}
 
#content.p_r5p1{ background:url(img/photos/r5p1.jpg) 100px 60px no-repeat; height:400px;}
.t_r5p1{position:relative; top:20px; left:500px; width:170px; height:26px;}
.r5p1{padding:70px 0 0 470px; top:70px; left:470px; width:500px; height:200px; color:#1D4C81; font:11px Verdana, Arial, Helvetica, sans-serif;}
 
#content.p_r6p1{ background:url(img/photos/r6p1.jpg) 100px 60px no-repeat; height:400px;}
.t_r6p1{position:relative; top:20px; left:500px; width:170px; height:26px;}
.r6p1{padding:70px 0 0 470px; top:70px; left:470px; width:500px; height:200px; color:#1D4C81; font:11px Verdana, Arial, Helvetica, sans-serif;}
 
 
/*histoire content*/
#content p.titrepage{ position:relative; top:40px; left:70px; font-size:25px; color:#4EB9B4; margin:0;}
#content.histoire{ background:url(img/histoire/histoire.jpg) 600px 50px no-repeat; height:452px;}
#content p.histoire{ position:relative; top:60px; left:70px; color:#0A51A1; width:500px; font-size:12px; text-align:left; line-height:22px;  margin:0;}
 
/*pied*/
#pied{width:980px; height:45px; background:url(img/commun/fond_pied.jpg) 0 0 no-repeat; position:relative;}
#pied p.navigation{color:#fff; margin:0; width:531px; float:left; height:25px; padding:0 0 0 49px;}
#pied p.fil{color:#fff; margin:0; width:390px; float:right; height:12px; padding:13px 0 0 10px; font-size:13px}
#pied p.ref{color:#fff; margin:0; width:980px; float:right; height:10px; line-height:15px; text-align:center; font-size:10px; padding:5px 0 0 0;}
 
 
#contact{position:absolute; top:120px; right:0; width:111px; height:33px;}
 
 
.vert{color:#53bab7;}
.f12{font-size:13px; color:#1D99C4;}

j'aurais voulu que le tableau apparaisse juste aprés cette ligne:
SARL au capital de 285 000€

24/08/2007, 13h33
Madfrix

Tu visualises ta page avec quel browser HTML ? Car chez moi avec IE6 ton tableau apparaît bien en dessous de la ligne SARL au capital de 285 000€
24/08/2007, 13h52
nefertitia

Pour moi, le tableau ne s’affiche pas au bon endroit, quelque soit le navigateur.

voula ce que j'obtient:
http://img186.imageshack.us/img186/79/sanstitrelq7.png
24/08/2007, 14h06
Madfrix

Voici ce que je visualise :

http://img259.imageshack.us/img259/3307/divie5.jpg

ton tableau apparaît bien en dessous de SARL au capital de 285 000€. C'est ce que tu veux non ?
24/08/2007, 14h08
nefertitia

Tout à fais !

je voi que tu utilise exploreur ^^

mais pourquoi ça ne fonctionne pas coretement sur aucun des deux?

sur mozilla, le tableau n'est pas à la bonne place, et sur exploreur, les pages ne sont pas completes...
24/08/2007, 14h11
Madfrix

Citation:

Envoyé par nefertitia

Quel est ton navigateur pour cette capture ? moi c’était Mozilla.

navigateur HTML = browser HTML pour info ;)

Sinon c'est IE 6
24/08/2007, 14h14
nefertitia

Bon et bien ce n’est plus ma part de boulot ^^

Merci quand même pour ton aide Madfrix !
24/08/2007, 18h04
°°° Zen-Spirit °°°

Salut tout le monde !
Je voudrai poser un question à l'auteur du site de ce post ( http://www.biologieindustrie.com/r6p2.htm)
mais comme il est plus là, vous pourrez peut être m'aider !
Je voudrai savoir quelle police d'écriture il a utilisé pour son site, par exemple l'écriture de son menu déroulant et e sous-menu.
Moi avec FIREBUG, il m'affiche ceci :
div#navigation ul
{
font-family:Trebuchet MS,Arial,Helvetica,sans-serif;
font-size:12px;
font-size-adjust:none;
font-style:normal;
font-variant:normal;
font-weight:normal;
line-height:normal;
list-style-image:none;
list-style-position:outside;
list-style-type:none;
}
Donc, j'en déduis qu'il s'agit de la police "Trebuchet MS". mais le soucis c'est que je n'arrive pas à retrouver cette police suGoogle, ni dafont, ni sur le net en général.

Merci.
24/08/2007, 18h09
°°° Zen-Spirit °°°

Par contre j'ai maintenant une autre question liée à ce post, c'est sur le menu, que je trouve très bien.
Je voudrai savoir les bases pour créer ce genre de MENU, car je comprends tout ce qui est des ul, li, ... mais par contre je ( en rouge ) :

Citation:

<div id="navigation">
<ul>
<li class="menu1"><a onmouseover="MM_swapImage('Image2','','img/commun/btn1_r.gif',1)" onmouseout="MM_swapImgRestore()" href="#"><img width="147" height="27" border="0" id="Image2" name="Image2" src="http://www.biologieindustrie.com/img/commun/btn1.gif"/></a>
<ul>
<li><a class="ssmenu" href="r1p1.htm">> Les essais</a></li><br/>
<li><a class="ssmenu" href="r1p2.htm">> Les études</a></li><br/>
<li><a class="ssmenu" href="r1p3.htm">> Les études non interventionnelles</a></li><br/>
<li><a class="ssmenu" href="r1p4.htm">> Les dispositifs médicaux</a></li>
</ul>
</li>

<li class="menu2"><a>
...
...
...
etc
</li>

Je ne comprends pas trop à quoi correpond ce bout de code que j'ai mis en rouge. En mettant ce code, que veut dire le webmaster ? Qu'est ce qi se passe si on le met pas, concrètement pour que je comprenne mieux.
Merci.
24/08/2007, 18h54
Madfrix

C'est simple cette portion de code s'exécute lorsque le curseur de ta souris passe sur ton lien

onMouseOver ==> code exécuté lors du passge de la souris
OnMouseOut ==> code exécuté lorsque ta souris quitte cet élément

En gros ce bout de code, pour faire simple, change d'image lorsque ta souris survole ou quitte ton lien. C'est tout !
24/08/2007, 19h20
°°° Zen-Spirit °°°

Merci d'avoir répondu Madfix !
C'est compris pour le onmouseover et le onmouseout.
Cependant je ne comprends pas tout dans le code, par exemple, le "MM_swapImage" ou encore le "MM_swapImgRestore()".
çà signifie quoi ce code là ?
Sinon, quelqu'un peut m'aider et me dire quelle est la police que le webmaster à utiliser sur ce site là, pour faire son menu ? ( http://www.biologieindustrie.com/r6p2.htm)
En fait mes explications, que je n'arrivent pas à comprendre d'ailleurs se trouvent sur le 1er topic.

Merci encore.
24/08/2007, 19h37
Madfrix

Citation:

Envoyé par °°° Zen-Spirit °°°

Merci d'avoir répondu Madfix !
Cependant je ne comprends pas tout dans le code, par exemple, le "MM_swapImage" ou encore le "MM_swapImgRestore()".
çà signifie quoi ce code là ?

Ce sont des fonctions définies par celui qui a réalisé la page web. Donc sans le code de ces fonctions, c'est impossible de dire ce qu'elles font vraiment...

A priori, vu leur nom ce sont des fonctions qui font apparaître et disparaître des images...

Pour ce qui est du menu, il est constitué d'images donc tu ne trouveras pas à priori la police de ce menu dans le code css.
24/08/2007, 20h26
°°° Zen-Spirit °°°

Oui merci encore pour ta réponse !
je me permets encore un petit renseignement, an fait les sous menus sont bien des polices d'écriture non ???
Le Menu est une image OK, mais les sous menus, je ne le pense pas. Et c'est cette police là que je cherche.
Merci !