Changement de Police

Version imprimable

18/08/2009, 15h58
malabarbe

Changement de Police
Bonjour à tous,

J'affiche 3 champs de la base de donnée avec des
espaces entre chaque champs pour les aligner.
Code:

1 2 <option value='../menu_aff.php?jaq=$row[Num]&org=$org'>rec</option>";
Tout ce passe bien avec la police : Courier New
mais si je met Arial, les colonnes sont décalées.

Je sais que les espaces ne sont pas gérés de la mème
faço d'une police a l'autre.

Mais pour des raisons d'esthétique, je dois garder Arial.

Comment gérer cela ?

Ou, une liste déroulante a 3 colonnes ?

A vous lire
18/08/2009, 16h15
Xenon03

J'aurais bien dis : avec des div

Sinon plus simple encore : avec des tableaux :ccool:
18/08/2009, 16h20
malabarbe

Bonjour Xenon03,

Ok pour un tableau.

Mais comment l'asapter a mon code ?
20/08/2009, 18h38
HiRoN

Bonjour,

J'ai personnellement un peu de mal à comprendre la demande.
Une capture d'écran serait la bienvenue ;)

Je ne vois pas en quoi l'utilisation de div ou d'un tableau pourrait résoudre le problème étant donné que le code donné montre un option d'un select... :?
21/08/2009, 15h46
Xenon03

Je n'avais pas vu autant pour moi :ccool:
21/08/2009, 15h51
malabarbe

Bonjour,

Quel conseil pourais-tu me donner ?
21/08/2009, 16h29
HiRoN
Dans l'idée (mais sans capture pour visualiser le problème, difficile de répondre avec précision) :
- Tu récupères tes valeurs
- Tu les mets sous la forme val1 | val2 | val3
- Tu mets un style sur le option du select afin de gérer la police, la taille etc. (ce dont tu as besoin)
- Tu adaptes la largeur du select
Je vois pas trop quoi dire d'autre... :?

OK HiRoN,

Je suis arrivé a cela :

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
 
<title>Num</title>
</head>
<body>
<!--<div align="center">-->
<CENTER>
<div align="center" style="width:718px;height:315px;overflow:auto">
 
	<table border="3" width="77%" height="315" id="table1">
		<tr>
			<td>
			<table border="1" width="100%" cellspacing="0" cellpadding="0" style="border-collapse: collapse" height="15" id="table2">
<div align="center">
	<table border="0" width="716" cellpadding="0" style="border-collapse: collapse" height="291" id="table3">
 
<?PHP
$i="1"; 
while ($i <30)
{
?>		
				<tr>
					<td width="4">&nbsp;</td>
					<td width="51"><?PHP echo $i; ?></td>
					<td width="266"><?PHP echo $i; ?></td>
					<td width="185"><?PHP echo $i; ?></td>
					<td>&nbsp;</td>
				</tr>
<?PHP
$i++;
}                               
?>
</table>
</div>
			</table>
			</td>
		</tr>
		<tr>
			<td height="23">&nbsp;</td>
		</tr>
<!--	</table>-->
</div>
</body>
</html>

Reste a gérer :
- Que chaque ligne devienne un lien
- Mouseover sur ligne
- La petite main sur le lien

Un petit coup de main pour finaliser...

21/08/2009, 16h50
HiRoN

Citation:

Envoyé par malabarbe

Reste a gérer :
- Que chaque ligne devienne un lien
- Mouseover sur ligne
- La petite main sur le lien

Citation:

Envoyé par malabarbe

- Que chaque ligne devienne un lien

Il rajoutant un lien :

Code:

<td><a href="#" title="">val1</a></td>

Citation:

Envoyé par malabarbe

- Mouseover sur ligne

Soit en jouant sur le a, soit directement sur le <tr> (par exemple, mais non compris par ie6 & <)
Si sur le tr :

Code:

tr:hover { ... }

Citation:

Envoyé par malabarbe

- La petite main sur le lien

Par défaut sur un lien, mais si besoin

Code:

ton_id_ou_class { cursor:pointer; }
21/08/2009, 17h00
malabarbe
Je n'arrive pas a intégrer
Code:

1 2 <td><a href="#" title="">val1</a></td>
dans mon code
21/08/2009, 17h04
HiRoN

Tu remplaces :

Code:

<td width="51"><?PHP echo $i; ?></td>

Par :

Code:

<td width="51"><a href="" title=""><?PHP echo $i; ?></a></td>

Idem pour les autres lignes... (il te faudra ensuite gérer l'action des liens + leur style)

Je t'invite vivement à consulter les cours & FAQ (cf ma signature), tes problèmes étant liés à la base du (X)HTML & CSS... ;)
21/08/2009, 17h12
malabarbe

Ok, c'est bon

Mais comment étendre ce lien sur les 3 colonnes de
données de la mème ligne ?
21/08/2009, 17h19
HiRoN
Citation:

Envoyé par malabarbe

Mais comment étendre ce lien sur les 3 colonnes de données de la mème ligne ?

Ce n'est (sauf erreur de ma part) pas possible, un tableau devant être de la forme (au minimum) :
Code:

1 2 3 4 5 6 7 <table> <tr> <td></td> <td></td> <td></td> </tr> </table>
Plusieurs choix :
Soit tu revois la construction de ton tableau et tu tentes plutôt du style

Code:

<td><a href="#" title=""><?PHP echo $i; ?> | <?PHP echo $i; ?> | <?PHP echo $i; ?></a></td>

Soit tu mets 3 liens (1 dans chaque td) renvoyant sur la même chose...
Soit tu enlèves le lien et tu met un onclick sur le tr (afin de simuler un lien), mais bon, à éviter si possible... (javascript intrusif)
21/08/2009, 17h30
malabarbe

La première solution fonctionne, mais ne conviens pas car la police que j'emploie n'est pas monospace et j'ai fatalement des décalages a l'affichage sachant
que les données n'ont pas toujours la même longueur.

Le onclick sur le tr (afin de simuler un lien) me plait bien, comment réaliser cela ?
21/08/2009, 17h38
HiRoN

En regardant du côté de window.open (javascript) ;)
Le but étant de te donner des pistes de réflexions, pas de te faire la chose... :aie:
21/08/2009, 17h44
malabarbe

Ok, je vais fouiller du côté de window.open

En tout cas, Merci pour tes bons conseils
21/08/2009, 17h48
HiRoN

Je ne peux que te conseiller de faire un tour dans la FAQ Javascript ;)
21/08/2009, 23h57
malabarbe

Ok HiRoN,

J'ai trouvé plusieurs possibilités et je vais tester

Un grand Merci pour le coup de main.

@ +