Reprise du message précédent :

 
J'aimerai le faire uniquement en CSS  
Bon, sinon au pire je rajoute un div entre le h2 mais dans le contexte le div n'a clairement rien à faire

Pourquoi tu mets pas un <img> entre les <h2>

 
Parce que

parce que c'est mal

plus sérieusement : référencement et accessibilité

sinon, tu peux pas juste foutre une classe ?

 
Si je peux, mais de toute façon j'appelle mon bloc comme suit :
 
#tbl_news_team h2

<h2><a id="newsteam">blah blah</a></h2>

#tbl_news_team h2 {
  width: 150px;
  height: 50px;
  background: url(images/titre_news_team.png) no-repeat top left;
}
 
#tbl_news_team h2 a {
  display: none;
}

 
Ouais, j'y avais pensé, mais sémantiquement c'est pas grave d'utiliser une balise lien pour un tout autre objectif ?

http://www.w3.org/TR/html401/struc [...] l#h-12.2.3
donc c'est con comme suggestion en fait
en même temps, t'as pas bien le choix (ou alors foutre un span dans le h2 à la place du a)
 
y'a des trucs avec text-indent négatifs pour masquer le texte je crois (un truc comme ça), mais quand j'avais testé j'avais trouvé ça foireux (j'ai ptet mal testé ceci dit)

oui , enfin y a des limites ( surtout imposé par le temps que tu veux y passer )  

et ce que tu gagne sur l'image , tu l'ajoute a ton html
 

pourquoi un lien et pas genre un span

et sinon :

<h2>News.UnitedTeam</h2>

http://kryogenix.org/code/browser/lir/

J'opte pour ta solution avec un text-indent: -9999px.

Bah, je trouve pas que ce soit la mort non plus :

<div id="tbl_gauche_haut">
        <h2>Titre du tableau</h2>
        <p>Contenu</p>
        <p>Contenu</p>
        <p>Contenu</p>
        <p>Contenu</p>
        <p>Contenu</p>
        <p>Contenu</p>
        <p>Contenu</p>
        <p>Contenu</p>
    </div>

#tbl_gauche_haut {
margin: 0 0 0 1px;
float: left;
background-image: url(../gfx/tbl_gauche.png);
background-repeat: no-repeat;
width: 291px;
height: 149px;
}
#tbl_gauche_haut h2 {
font-size: 14px;
text-align: right;
margin: 4px 10px 0 0;
padding: 0 0 10px 0;
}
#tbl_gauche_haut p {
font-size: 10px;
margin: 0 0 5px 0;
text-align: right;
padding: 0 10px 0 10px;
}

Si ça c'est pas de la bidouille

 
De toute façon j'ai fait autrement
 

<h2><span>News United Team</span></h2>

#tbl_news_team h2 {
background-image: url(../gfx/titre_news_ut.gif);
background-repeat: no-repeat;
width: 81px;
height: 5px;
text-align: left;
margin: 10px 0 0 35px;
padding: 0 0 21px 0;
}
#tbl_news_team h2 span {
display: none;
}

<h2><span>News United Team</span></h2>

#tbl_news_team h2 {
background-image: url(../gfx/titre_news_ut.gif);
background-repeat: no-repeat;
width: 81px;
height: 5px;
text-align: left;
margin: 10px 0 0 35px;
padding: 0 0 21px 0;
}
#tbl_news_team h2 span {
display: none;
}

Pas besoin du span, regarde mon lien

 
Faut que je prenne le temps de le lire.

Le 2eme truc de ton lien je le trouve crade perso, genre quand tu sélectionnes l'image, tu sélectionnes aussi en blanc un espèce de texte mal caché au-dessus, berk
Par contre ya pas de span

Les tables c'est bien

et de 4

gné ?

Gné ?? Moi il faudrait que l'on m'en explique l'utilité
( terrible la vidéo on dirait moi sous notepad ça )

c est un jeu de poster ste video tous les deux jours

oui

Pas vu Et si je l'ai pas vu, il doit y en avoir d'autres dans le même cas
 

 
Putain mais faut être un grand malade

 
au moins 2

2-3 pages avant ce post - pour ici, et sans doute poster sur blabla prog... Bien avant

 
C'est la meilleure solution, certains lecteurs d'écrans ne lisent le display:none;
Dans un deuxième temps ton span ne sert à rien finalement, ça ajoute du contenu pour rien dans la page.

si tu te souciais vraiment des lecteurs vocaux, et pas juste pour , tu aurais de toutes façons une stylesheet séparée pour y specifier les parametres vocaux

Ce serait pas les labels ça pour les aveugles ?

C'est sur vu l'implentation du truc je le fais sur tous les sites sur lesquels je bosse. Edit : (ironisme)
Dans un deuxième temps je vois pas le rapport entre stylesheet pour le media:aural/speech et le fait d'afficher ou pas un élément ou pas et sa lecture hypothétique.

trop bien les marges qui apparaissent de nulle part avec IE

 
Je suis obligé de mettre un span, le text-indent sur le h2 alors que celui-ci a déjà l'image en background ne fonctionne pas.
L'image s'affiche mais le texte aussi.

C'est la méthode version bourrin en fait, ici t'as un panel de techniques un peu plus propre :  
 
http://www.blog-and-blues.org/webl [...] e-en-image

bon, y'a quoi comme technique pour faire des règles spécifiques à safari ?
 
pour IE j'utilise les conditional comments, mais pour safari... ?

Est-il possible de spécifier sur combien de pixel de haut une image en background doit se répéter ?

Bien sur, en CSS3

 
Et bam, on est repartie pour un gros bloc en gif/jpg

server-side

Dites, pour gérer ça :
 

 
J'ai utilisé une liste.
 
Mais en fait je me dis que ce n'est pas possible car à ma connaissance une liste a forcément les mêmes puces, pas moyen de les changer en fonction de la ligne non ?
 
Je vais donc devoir faire ça avec des paragraphes ou autres ?