Discussion :

[vva]

Bonjour à tous,

Je suis en train de créer un site par affichage dynamique et j'aimerai que le contenu de mes pages s'affiche dans span ce qui me permet de gérer leur affichage (position, taille, style) par une base de données.
j'arrive avec bien du mal à gérer les positions de mes boîtes mais ce qui me paralyse encore plus est de ne pas parvenir à forcer des largeurs et des hauteurs fixes quelque soit le contenu à afficher.
voici le style appliqué au cadre

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
<span name='1' id='16' width='470px' height='180px' z-index='1' style='position: Relative; overflow: scroll; left: 5px; top: 5px; border : 1px solid gray;'>

est-il possible de faire ce que je souhaite ou le span s'adapte t il toujours au contenu quelque soit la taille demandée ?

merci d'avance

vincent

[Bisûnûrs]

Trois erreurs dans ton code :

1. Les attributs HTML width et height ne prennent pas d'unité dans le cas des px.
2. L'attribut HTML z-index n'existe pas.
3. Les dimensions d'un span ne fonctionnent pas s'il n'est pas passé en élément block.

[vva]

1. Les attributs HTML width et height ne prennent pas d'unité dans le cas des px.
->ok j'ai essayé les deux alors je retire les pixels

2. L'attribut HTML z-index n'existe pas.
-> je vais l'inclure dasn le style. Est une raison du plantage ?

3. Les dimensions d'un span ne fonctionnent pas s'il n'est pas passé en élément block.
->est à dire que dasn style je dois préciser display; block; ??

merci

[Bisûnûrs]

Le z-index n'est pas une raison du plantage, non, juste que t'en qu'à faire, autant relever toutes les erreurs.

Tu as bien compris, tu dois rajouter display:block dans le style pour que le span puisse prendre en compte les dimensions que tu lui donnes.

[vva]

alors j'ai apporté les trois corrections que tu m'as suggérées mais rien ne change au niveau de l'affichage les 4 images s'affichent les unes en dessous des autres aulieu d'être en damier

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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
 
<style>
#Display
{
z-index: 0;
position: absolute;
left: 1%;
top: 16%;
width: 990px;
height: 90%;
border-top: 5px solid navy;
border-left: thin solid navy;
border-right: thin solid navy;
border-bottom: 5px solid navy;
overflow: auto;
}
</style>
 
<span id='Display'>
<span name='1' id='16' width='470' height='180' style='position: Relative; display: block; overflow: auto; left: 5; top: 5; border: 1px solid gray; z-index: 1;'>
<img src='images/hiver 7.jpg' border='0' width='470' height='180'>
</span>
<span name='2' id='17' width='470' height='180' style='position: Relative; display: block; overflow: auto; left: 20; top: 5; border: 1px solid gray; z-index: 1;'>
<img src='images/hiver 7.jpg' border='0' width='470' height='180'>
</span>
<span name='3' id='18' width='470' height='180' style='position: Relative; display: block; overflow: auto; left: 5; top: 20; border: 1px solid gray; z-index: 1;'>
<img src='images/hiver 7.jpg' border='0' width='470' height='180'>
</span>
<span name='4' id='19' width='470' height='180' style='position: Relative; display: block; overflow: auto; left: 20; top: 20; border: 1px solid gray; z-index: 1;'>
<img src='images/hiver 7.jpg' border='0' width='470' height='180'>
</span>
</span>

[Bisûnûrs]

En damier ? En même temps je ne pouvais pas le deviner, j'ai juste répondu à la question originelle.

Pourquoi as-tu enlevé les unités dans le CSS pour les propriétés top et left ?

[vva]

effectivement l'affichage de la page doit se faire dans des pavets multiples affichés sous forme de damier selon le style présisé dans la DB.

j'ai remis px pour top et left mais sans conséquence par contre si je retire display: block; j'obtiens le bon positionnement de mes spans mais de quelques pixels de haut et de large car ils sont vides