Yo les moules
 
Bon j'ai pas trop le temps de faire un speech et je poste ici à l'arrache au cas où quelqu'un en aurait.
 
Le but du jeu est d'avoir des boutons que l'on peut mettre sur une ligne, auto-extensible (prennent la largeur de leur contenu) et dont on puisse leur spécifier une hauteur (afin d'avoir un texte bien aligné avec un line-height et l'image de fond qui s'affiche correctement .
 
les boutons sont composés de deux images, désolé j'ai pas pu faire avec une seule, cause : il faut pouvoir gerer la transparence des boutons aussi .
 
Voila la page, explication à l'arrache à l'intérieure du fichier.
http://gatsu.ftp.free.fr/html/inli [...] utton.html
 
sinon c'est compatible IE5.5+, FF1.0-1.5, Opera 8.5+, SAFARI 2.0 (les versions <2.0 devraient supporter)

hehe dommage
quand je change la taille de ma police par défaut, ça buggue.

 
Mais qu'est ce que tu crois c'est un bouton qui a une hauteur défini

et alors? height:1em, tu connais pas? je suis sûr que oui.

Mais qu'est ce que tu veux que ça me fasse    
L'image par défaut du bouton fait 24px de haut, le but du jeu est d'obtenir un élément qui se place en inline avec le comportement d'un élément de type block afin que l'on puisse le dimensionner
Ton height:1em; je me le fous au cul car il ne sert à rien là, sachant que je veux une hauteur fixe, donc une unité relative ne me servira à rien ici
 
Et dans tous les cas si le user agrandit la police c'est tout à fait normal que le bouton pète dans ce cas il faut créer un autre système de bouton
 
mais à l'heure actuelle, soit tu utilise 36Div et tu fais du caca, soit tu te console avec un A et un SPAN et tu as du HTML propre

 
rien que ça, ça fait chier...
 
Et puis qui te dit que la future version de firefox ou de safari va encore manger tes "hacks" ?
 
Non, ya pas à dire, les hacks c'est le mal

 
Pourquoi ça te ferait chier
 
C'est juste histoire d'avoir un bouton qui se size en fonction de son contenu si tu n'as pas compris ça je ne peut rien pour toi.
J'utilise juste une petite image en fond sur le A à gauche, puis je met un padding-left de la largeur de l'image, ensuite je met une image d'une très grande longueur à droite sur le span tu as plus simple pour faire un bouton qui prend la largeur que tu veux tout en ayant une transparence sur les coté
 

Ben ouais mais peut etre que la future version de firefox supportera le inline-block, et là yaura plus besoin de hack du tout
De toute manière c'est la méthode la plus soft que j'ai pu trouvé en faisant pas mal de recherche ce matin et ce midi.

 
j'ai bien compris, mais ça fait chier d'avoir une grosse image pour un coin de merde et c'est pas du tout logique, c'est tout. C'est une "astuce", un contournement de problème, un truc bancal, le tout associé à des hacks tout aussi bancals.

 
Le principe, je le connais depuis belle lurette, j'ai passé presque 1 an à tout retourner dans tous les sens concernant XHTML + CSS.
 

 
Oui, une table.  
Oui c'est laid, mais ça marche partout avec le même code pour tous les navigateurs, y compris les navigateurs un peu vieux.
 

 
Ben ouai, peut être. Le mieux est encore de renoncer à ce genre de bouton.

Ben si FF avait compris le inline-block je n'aurai pas eu besoin d'utiliser un hack pour lui
et puis utilser une image très grande n'a rien de mal en soit, je ne vois pas ou est le problème. Le but du jeu étant d'alléger au maximum le HTML
 

Ben ouais moi aussi, et c'est devenu mon taf depuis 3 mois et ma passion  
 

Ben c'est très laid, le but du jeu des CSS étant d'alléger au maximum le HTML (je me redit)
 

Ben tant qu'il y aura des graphistes tordus on pourra pas, et puis ya aucun mal à utiliser ce genre de bouton, et puis j'essayais juste de repondre à une contrainte technique.
 
et puis mes bouton en <span><a></a></span> sont assez souples au niveau du chteumeuleu
 
C'est quand même mieux que d'utiliser un truc comme ça
 

et ce truc est censé faire la même chose que mon bout de HTML

 
Souples au point de pouvoir choisir de les séparer entre eux de 10 px par exemple ?
 
Parce que j'ai comme un gros doute là...

Je sépare juste la partie gauche du span par rapport à la bordure gauche du A afin que le background du span ne cache pas le background du A , faut te faire un dessin ou pas.
 
Après mon bouton il est très souple en largeur

 
M'en fout de ta souplesse en largeur. Je te demande si tu peux SEPARER tes jolis boutons avec un espace de par exemple 10px.

Histoire de par exemple faire un menu...

mais qui te parle que le span et le A sont deux bouton ?
ce sont les deux éléments qui font le bouton ) moins qu'on se soit mal compris .
 
Mais s'il le faut je les sépare de 10px si besoin
 
<a class="button" href="#"><span>My button text</span></a><a class="button" style="margin-left:10px" href="#"><span>My button text</span></a>
 
J'ai ptet pas compris ta requête

Et si tu veux les coller les uns aux autres ? Ya pas l'espace insécable ?

ce ne sont pas des boutons pour  faire un menu, ce sont des boutons inline que tu peux foutre n'importe où dans ta page
 
dans le cadre de bouton de menu, autant utiliser le float:left, qui justement transforme un élément block, en pseudo-inline-block.
 
l'élément flotté ne prend alors que la largeur de son contenu

 
T'as essayé ça ? ça marche ?    

Je viens de le faire, et de le tester sur ma page .

 
Ben tiens, on y vient...
 
Bref, ton truc sert strictement à rien.  
 
Essaye donc de faire des jolis menus horizontaux avec un coin gauche et un coin droit pour chaque bouton de largeur strict, avec le contenu du bouton qui s'adapte et avec la possibilité d'avoir le texte du bouton qui s'adapte à son contenu, + la possibilité de rêgler l'espace entre chaque bouton.
 
Là, tu commenceras à m'intéresser un peu plus déjà...

 
Et bien montre.

Tete de noeud
Tu n'as pas encore compris que mon bouton n'est pas là pour être dans un menu
mais au beau milieu de ta page ou autre part
j'ai juste répondu à une contrainte technique que j'avais jusqu'à maintenant à mon taf
s'il faut faire un menu c'est du UL LI A et tu styles

 
Un bouton qui se balade en plein milieu d'un texte avec des coins, tu parles d'une contrainte.

 
Mais bien sûr. Avec les contraites que j'ai indiqué, tu peux toujours courrir... (enfin pour avoir un truc léger et pas bourré de hacks dans tous les sens...)

http://gatsu.ftp.free.fr/html/inli [...] utons.html  
C'est ça que tu veux
tu me diras ou sont les hacks

 
Oui, c'est ça.
 
Et maintenant, dans le cadre d'un CMS, je veux que la longueur totale de l'ensemble fasse 100% de largeur (la largeur d'un div de 760px par exemple) et que suivant le nombre de boutons, ils se positionnent automatiquement proportionnellement en longueur.
 
Oui, parce que ce qui m'intéresse moi, ce sont les contenus dynamiques... Si je sais à l'avance le nombre de boutons que je vais avoir ainsi que le texte je peux aussi bien les positionner moi même en absolure.

Oui, c'est ça.

Dans tes rêves , tu sais pertinament que même en spécifiant des unités de longeur en pourcent sur les boutons on ne peut pas forcément obtenir ce que tu désir, et seul le tableau peut répondre à ton besoin. Ce qui a été fait à mon taf.  
Mais bien sur un tableau minimaliste hein
 

Bah Table mais avec des éléments totalement stylables bien entendu.

J'ai un bouton qui marche sur le changement de police, s'adapte sur la longueur du machin, code HTML propre sans hack en plus    

 
Forcement si les autres navigateurs que Firefox y'a peut être pas la bordure comme il faut  

Bon apparament ya que des gens buttés ici hein .
 
Désormais pour des solutions CSS vous demanderez à Harko, ils saura largement mieux que moi savoir quoi faire

 
Bien entendu

 
Nan, ya aussi des gens réalistes qui se sont pris la tête pendant des mois/années pour en arriver à la conclusion que les divs et cie, c'est très bien, dès que c'est possible, que ça allège le code et que ça permet en plus de gérer des contenus dynamiques, mais que s'il s'agit d'utiliser des techniques hasardeuse pour le plaisir de dire qu'on a fait du 100% pur div/css, c'est 0.
 
Meilleur exemple : 3 colonnes qui poussent une footer.    

Euh... Y'a vraiment rien de compliqué à ça    

 
Ben tu sais pas faire de CSS alors .
 
1-ce ne sont pas des techniques hasardeuses
2-Seulement Firefox ne repond en rien aux critère donc une pseudo-classe before devant et  vlan
3-Je ne suis pas partisan du tout CSS, mais que je peux le faire je m'y lance, en  milieu pro, mes les sites pour lesquels j'ai fait énormément de CSS avait quand même une structure en table. (un tableau de 3 colonnes)

un clear:both sur le footer c'est pas fait pour les chiens