Discussion :

[QuickSave]

Bonjour,

Voici le code CSS :

Code :

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

1
2
3
4
 
.yui-dt-table th.yui-dt-asc.yui-dt-sortable div.yui-dt-header {
	background:		url(../imgs/t_tri_asc.gif) no-repeat center right;
}

Je me demande quel est le code html qui fonctionne pour faire afficher cette classe. Où me trompe-je ?

Code :

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

1
2
3
4
5
6
7
8
9
10
 
<table class="yui-dt-table">
  <thead>
    <tr>
      <th class="yui-dt-sortable" width="95">
        <div class="yui-dt-header">
	  <div class="yui-dt-asc">Quantité</div>
	</div>
      </th>
      ...

Merci d'avance

[Halleck]

Il me semble que c'est le framework de Yahoo (disponible gratuitement sur le site de yahoo), mais je ne suis pas sûr de bien comprendre ta question.

[QuickSave]

C'est en effet à Yahoo

Ma question est que je n'arrive pas à faire afficher la classe mise en évidence plus haut !
Comment faire afficher l'image de fond ?
Comment s'y prendre ?

Merci !

[Deallyra]

Code :

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

1
2
3
4
<table class ="yui-dt-table">
    <th class="yui-dt-asc">
        <??? class = "yui-dt-sortable">
            <div id = "yui-dt-header">

[QuickSave]

Je viens d'essayer :

Code :

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

1
2
3
4
5
6
7
8
9
 
<table class="yui-dt-table">
 <thead>
  <tr>  
   <th class="yui-dt-asc" width="95">
    <div class = "yui-dt-sortable">
     <div id = "yui-dt-header">Quantité</div>
    </div>
   </th>...

Ca ne fonctionne pas toujours pas !
Pourquoi utiliser un "id" ?
Je croyais que c'était un # pour un "id".

[Halleck]

Le problème des frameworks c'est que tu ne sais pas d'où vient le problème. Il faudrait regarder en détail la feuille de style. Ce code vient d'où? Directement de yahoo? Sinon, la feuille de style a pu être modifiée...

# c'est dans la feuille de style pour le déclarer, pour l'appeler c'est "id=monstyleperso"

[Candygirl]

Code :

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

1
2
3
4
.yui-dt-table th.yui-dt-asc.yui-dt-sortable div.yui-dt-header {
	background:		url(../imgs/t_tri_asc.gif) no-repeat center right;
}

Hello,

Il n'y a pas d'espace entre .yui-dt-asc et .yui-dt-sortable clea signifie donc que les deux nom de classe sont attribuées au th:

Code html :

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

1
2
 
<th class="yui-dt-asc yui-dt-sortable">

[QuickSave]

Tout d'abord, je tiens à vous remercier de me répondre si rapidement. Malheureusement, je n'arrive toujours pas à faire fonctionner cette gentille css. Le problème viendrait de IE6. Cela fonctionne correctement sous Firefox 2.

Voici encore le code css plus complet :

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
 
.yui-dt-table thead tr th.yui-dt-sortable div.yui-dt-header {
	background: url(../imgs/t_tri_aucun.gif) no-repeat center right;
}
 
.yui-dt-table th.yui-dt-asc.yui-dt-sortable div.yui-dt-header {
	background: url(../imgs/t_tri_asc.gif) no-repeat center right;
}
 
.yui-dt-table th.yui-dt-desc.yui-dt-sortable div.yui-dt-header {
	background: url(../imgs/t_tri_desc.gif) no-repeat center right;
}

Et voici le code HTML fonctionnant sous firefox et pas sous IE6 :

Code :

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

1
2
3
4
5
6
7
8
9
10
 
<table class="yui-dt-table">
    <thead>
	    <tr>  
	        <th class="yui-dt-sortable">
	            <div class="yui-dt-header">Type d action</div>
	        </th>
            <th class="yui-dt-asc yui-dt-sortable" width="95">
                <div class="yui-dt-header">Quantité</div>
            </th>

Le label "Type d'action" a bien l'image "t_tri_aucun.gif" correcte. En revanche, le label "Quantité" devrait avoir l'image "t_tri_asc.gif". Le problème est que sous IE6, il a l'image "t_tri_aucun.gif".

Quel pourrait-être le problème ?

[franculo_caoulene]

Salut,

Code :

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

1
2
3
.yui-dt-table .yui-dt-asc {
	background: url(../imgs/t_tri_asc.gif) no-repeat center right;
}

ou

Code :

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

1
2
3
.yui-dt-table .yui-dt-header {
	background: url(../imgs/t_tri_asc.gif) no-repeat center right;
}

selon ce que tu souhaites précisément

[QuickSave]

La première solution me semble la meilleure mais il me faut rajouter le "div.yui-dt-header" :

Code :

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

1
2
3
4
 
.yui-dt-table .yui-dt-asc div.yui-dt-header {
	background:		url(../imgs/t_tri_asc.gif) no-repeat center right;
}

Code :

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

1
2
3
4
5
6
7
8
9
 
<thead>
	<tr>  
		<th class="yui-dt-sortable">
			<div class="yui-dt-header">Type d action</div>
		</th>
	   	<th class="yui-dt-asc" width="95">
			<div class="yui-dt-header">Quantité</div>
	   	</th>

ENCORE MERCI POUR TOUT !