[html] pbs: pour qu'une image suive le texte,affichage d'img

**dardadax** · 27/06/2007, 14h29

Bonjour tout le monde!
J'ai un problème:

Dans mon site (non mis en ligne) j'ai une bannière, un menu en css, et je voudrais avoir le reste de la page comme suit:

image | text

La subtilité est la suivante: l'image à gauche doit être centrée sur l'ensemble de la page et ainsi, lorsque l'on descend dans le texte, elle doit suivre le défilement du texte pour toujours apparaitre au centre de l'espace qui lui est alloué

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
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
 
<html>
 
 
<head>
 
 
<title> Mon site - Accueil</title>
 
<link rel = "stylesheet" type ="text/css" href = "moncss.css">
 
 
</head>
 
 
<body bgcolor="#01B1EC" hspace="0" leftmargin="0" rightmargin="0" bottommargin="0" topmargin="0" marginheight="0" marginwidth="0">
 
<div id="entete" name="entete" align="center" hspace="0" leftmargin="0" rightmargin="0" bottommargin="0" topmargin="0" marginheight="0" marginwidth="0">
	<alt href="index.htm"><img name="img_entete" src="images/entete.jpg" alt="banniere" height="100" width="920"></img></a>
</div>
 
</body>
 
 
 
<div id="nav" hspace="0" leftmargin="0" rightmargin="0" bottommargin="0" topmargin="0" marginheight="0" marginwidth="0" align="center">
	<ul>
		<li><a href="lien1.html">lien1</a></li>
		<li><a href="lien2.html">lien2</a></li>
		<li><a href="lien3.html">lien3</a></li>
 
	</ul>
	<br /><br />
</div>
<hr />
 
<table width="50%">
 
<tr>
<td width="50%">
<div id="accueil" width="50%" hspace="0" leftmargin="0" rightmargin="0" bottommargin="0" topmargin="0" marginheight="0" marginwidth="0" align="center">
<img src="img1.jpg">
</div>
</td>
<td width="45%">
<div id="texte" width="45%" hspace="0" leftmargin="0" rightmargin="0" bottommargin="0" topmargin="0" marginheight="0" marginwidth="0" align="center">
<p>&nbsp;</p>
<p align="justify">
<font color="#FFFFFF" size="4" face="Arial">
un long texte<br />x<br />x<br />x<br />x<br />x<br />x<br />x<br />x<br />x<br />x<br />x<br />x<br />x<br />x<br />x<br />x<br />x<br />x<br />x<br />x<br />x<br />x<br />x<br />x<br />x<br />x<br />x<br />x<br />
</font><br>
</p>
<td width="5%">
</td>
 
</table>
<hr />
 
</html>

CSS

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
33
34
35
36
37
38
39
40
41
42
43
44
45
46
 
#nav li {
    margin: 0;
    padding: 0;
    display: inline;
}
 
#nav li a:link, #nav li a:visited {
    display: block;
    float: left;
    height: 32px;
    width: 95px;
    line-height: 32px;
    text-decoration: none;
    text-align: center;
    background:#fff url(nav95.gif);
    padding: 0;
}
 
#nav li a:hover, #nav li a:active {
    background:#000 url(nav95.gif) 0 -32px;
    padding: 0;
}
 
A {
color:blue;
text-decoration:none;
}
A:hover {
color:red;
text-decoration:none;
}
 
#lien1 {
background: url(img1.jpg) #01B1EC no-repeat;
background-attachment: scroll;
background-position : center center;
}
 
#lien2 {
background: url(img2.jpg) #01B1EC no-repeat center center;
}
 
#lien3 {
background: url(img3.jpg) #01B1EC no-repeat center center;
}

Donc en gros (quitte à me répéter)

l'utilisateur va vouloir lire tout le texte, et lorsqu'il utilisera la barre de défilement de son navigateur, l'image doit suivre!

J'ai tenté:

1/ un tableau 2 colonnes 1 ligne: image puis text
D'une part, IE refuse d'afficher l'image en fonction IMG ^^
Donc dans le css j'ai du passer un fond d'écran

Secondo: je n'arrive pas à obtenir le défilement :s

2/ un double div (en gros je supprime le tableau et m'arrange, enfin j'ai tenté, de faire le même effet pour afficher l'image et n'avoir qu'un problème à résoudre)
Le hic? FF et IE cette fois-ci ensemble m'ont affichés seulement une partie du texte (en gros la premiere ligne de texte et autant pour l'image)

Si vous êtes dans le même cas que moi ou que vous avez eu le même problème, ou mieux encore si vous connaissez la solution, merci d'avance de laisser un message!

**chaminette** · 27/06/2007, 15h38

En tout tu veux une petite image qui descend avec la barre de défilement de la page ? c ça ??

**dardadax** · 27/06/2007, 21h48

en fait je veux que l'image à gauche reste fixe tandis que le reste (dont le texte) bouge :s

un peu comme dans les forums où vous descendez et que l'image de fond reste fixe :s

**blueice** · 29/06/2007, 14h14

Je n'ai pas lu ton message, mais peut-être est-ce ceci que tu recherches :
http://meyerweb.com/eric/css/edge/co...al/glassy.html

et je viens de lire il te suffit de mettre une image fixe en background, soit du body soit de la div, du tableau, bref une image en arrière-plan

[html] pbs: pour qu'une image suive le texte,affichage d'img

HTML

Vue hybride

Discussions similaires

Partager

Partager