[HTML]Probleme de div

Version imprimable

21/12/2005, 17h28
Davboc

[Resolu][HTML]Probleme de div

Salut !
J'ai un problème (je crois bien que je...)
Ma page s'affiche bien sous dreamweaver mais pas sous firefox (et encore moins sous IE mais c'est à cause des png). De plus la police ne passe pas...

Vu que des exemples valent mieux que des explications, voilà à quoi ça devrait ressembler (capture sous dreamweaver):
http://davboc.free.fr/Tahlaniak/SiteV2/Accueil.JPG

et voila a quoi ca ressemble :
http://davboc.free.fr/Tahlaniak/SiteV2/test.html

l'a po compris...

Merci !
Si vous avez des commentaires à faire n'hésitez pas je suis un noob c'est mon premier site à peu près propre...
21/12/2005, 22h09
Nesmontou

Salut, le code peut nous être aussi utile
22/12/2005, 00h32
francis m

mais il doit bien y avoir un problème de div avec des positions absolute ou quelque chose de ce genre

Voila le code html

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
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta name="classification" content="Personal" />
<meta name="description" content="Site de Tahlaniak, un groupe de musique composé d'étudiants de l'école d'ingénieurs Louis de Broglie, à Rennes." />
<meta name="keywords" content="musique, rock, tahlaniak, rennes, louis de broglie, broglie, club, boccou, domi, genot, allain, pierrat" />
<meta name="robots" content="ALL" />
<meta name="distribution" content="Global" />
<meta name="rating" content="General" />
<meta name="copyright" content="David BOCCOU" />
<meta name="author" content="David BOCCOU" />
<meta http-equiv="reply-to" content="http://tahlaniak.free.fr" />
<meta name="language" content="Fr" />
<meta name="doc-type" content="Web Page" />
<title>T a h l a n i a k   M u s i k</title>
<link rel="stylesheet" href="style.css"/>
</head>
 
<body>
 
<!-- Cadre principal -->
<div id="cadreprincipal">
<img src="Images/CadrePrincipal.png" alt="Cadre Principal" border="0" />
</div>
<!-- Entrée de menu 1 -->
<!--<div style="position:absolute; left:120px; top:300px; z-index:1;  color: blue"> -->
<div id="entreemenu1">
<a href="http://www.perdu.com"><img src="Images/boutonmenutest1.png" alt="BoutonTest" width="150" height="50" border="0" /></a></div>
<!-- Entrée de menu 2 -->
<div id="entreemenu2">
<a href="http://www.perdu.com"><img src="Images/boutonmenutest1.png" alt="BoutonTest" width="150" height="50" border="0" /></a>
</div>
<!-- Entrée de menu 3 -->
<div id="entreemenu3">
<a href="http://www.perdu.com"><img src="Images/boutonmenutest1.png" alt="BoutonTest" width="150" height="50" border="0" /></a>
</div>
<!-- Entrée de menu 4 -->
<div id="entreemenu4">
<a href="http://www.perdu.com"><img src="Images/boutonmenutest1.png" alt="BoutonTest" width="150" height="50" border="0" /></a>
</div>
<!-- Bouton d'affichage de la page actuelle -->
<div id="affichagerubrique">
<a href="http://www.perdu.com"><img src="Images/Dessus.png" alt="Page actuelle : Accueil" border="0" /></a>
</div>
 
<!-- Interieur du cadre principal -->
<div id="interieurcadreprincipal">
<br />
<h1>
<p align="center">Bienvenue sur le site de Tahlaniak ! <br /></p>
</h1>
<h2>
<p align="justify" style="text-indent:30px"> 
Vous voici dans le temple musical du campus de Kerlann...</p>
<p align="justify"style="text-indent:30px"> 
Tahlaniak Musik c'est le club musique du Bureau des Arts de l'école d'ingénieurs Louis de Broglie (relisez une seconde fois vous comprendrez mieux)</p>
<p align="justify"style="text-indent:30px">
On essaie d'organiser des rencontres entre les musiciens du campus et de participer aux différents évenements en faisant des concerts.</p>
<p align="justify"style="text-indent:30px">
Et oui ! Tahlaniak c'est aussi (et surtout) un groupe de musique !<br />
</p>
<p style="text-indent:30px">
Voilà c'est ça Tahlaniak !<br />
Continuez bien la visite du site et laissez nous un ptit message dans le livre d'or !</p>
<p align="right">
<br />
Dav, Ben, Mick, FX et Aurel, les zikos de Tahlaniak</p>
</h2>
</div>
</body>
</html>

Et voila mon 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
 
/* CSS Document */
h1
{
font:"Agency FB";
font-size:30px;
color:#000033;}
 
h2
{
font:"Agency FB";
font-size:20px;
color:#000033;
}
 
#affichagerubrique
{
position:absolute;
left:450px;
top:45px;
z-index:1;
}
 
#interieurcadreprincipal
{
position:relative;
height:550px;
width:500px;
left:360px;
top:260;
z-index:1;
}
 
#cadreprincipal
{
position:absolute;
left:180px;
top:100px;
z-index:0;
}
 
#entreemenu1
{
position:absolute; 
left:120px;
top:300px;
z-index:1;
}
 
#entreemenu2
{
position:absolute; 
left:120px;
top:370px;
z-index:1;
}
 
#entreemenu3
{
position:absolute; 
left:120px;
top:440px;
z-index:1;
}
 
#entreemenu4
{
position:absolute; 
left:120px;
top:510px;
z-index:1;
}

Je sais pas si c'était vraiment necessaire de tout mettre mais je ne sais pas du tout ou est l'erreur...
Merci pour votre aide !

24/12/2005, 02h43
francis m

le top de ton id interieurcadreprincipal doit être en px (260px par exemple)
et personnellement, même si cela fonctionne, je trouve étrange que ton interieurcadreprincipal soit en relatif et le affichagerubrique en absolu, alors qu'ils sont tous les deux dans le même niveau hiérarchique
24/12/2005, 11h49
Davboc

Merci ça marche ! J'ai commandé des yeux pour noël, ça ira mieux la prochaine fois désolé pour ce faux problème...

Par contre la police n'est toujours pas la meme et la taille non plus... Vous avez une idée ? C'est d'autant plus bizarre qu'elle fonctionne tres bien sur un autre "site" que j'ai fait avec un collègue...

Quant aux relatifs et absolu c'est vrai que c'est un peu bizarre, j'ai du faire ça pour tester... autant tout mettre en absolu non ?

Encore MERCI !! :D
24/12/2005, 12h47
francis m

la police "Agency FB" n'est certainement pas installée sur tous les ordinateurs (déjà, pas sur le mien)

si quelqu'un ouvre ta page avec cette police, le navigateur est obligé d'y substituer une autre police

donc je recommande de n'utiliser que des polices standards
24/12/2005, 13h57
Davboc

d'accord merci du tuyau ! encore un truc auquel j'avais pas pensé...
Pour info, voila une liste des polices communes aux Mac et PC que je viens de trouver. Je ne sais pas si elle est complète mais elle peut toujours être utile : http://cerig.efpg.inpg.fr/ICG/Dossiers/Typo/chap3.htm
24/12/2005, 14h42
Davboc

:?
J'ai essayé de remplacer la police par arial black et arial mais y'a rien à faire, firefox et IE me l'affichent avec times new roman...:cfou:
Les changements de taille sont par contre pris en compte...
Any idea ?

Merci
24/12/2005, 14h44
ilood

Salut

Comment as-tu déclaré arial black dans ton CSS ?
Tu l'as bien mis entre " " ?
24/12/2005, 14h47
Davboc
oui, en fait je ne l'ai pas tapé je code sous dreamweaver (très pratique d'ailleurs meme si on ne fait pas d'autogénéré et il propose un dropdown menu pour choisir les polices..)

voila ce qui est modifié par rapport au style.css affiché au dessus :
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 h1 { font:"Arial Black", Arial, sans-serif; font-size:30px; color:#000033; } h2 { font:Arial, sans-serif; font-size:18px; color:#000033; }
25/12/2005, 02h46
francis m

exemple:

Code:

font-family: "arial","verdana","helvetica", sans-serif;

donc font-family, arial entre guillemets, en miniscules
alors dreamweaver, oui, peut-être très pratique, mais...
25/12/2005, 22h59
Davboc

:P merci !
ET JOYEUX NOËL !!!!!