J'ai écrit un code qui crée automatiquement des sprites CSS basés sur les balises IMG dans une page et les remplace par des DIV avec (ce que je pensais être) CSS approprié pour positionner l'image de sprite comme arrière-plan. Le problème est que je n'arrive pas à faire en sorte que les DIV se comportent comme des remplacements pour les IMG. Si je laisse la valeur 'display' par défaut à 'block' alors si l'IMG original était positionné à la fin d'un texte, le DIV de remplacement sautera à la ligne suivante après le texte (ce qui est bien sûr ce que Je m'attendrais à quelque chose avec display: block à faire).Comment puis-je faire un DIV se comporter comme un IMG pour une utilisation comme sprite CSS?
Si je change le 'display' en inline, alors le DIV reste sur la même ligne que le texte mais il ignore la 'largeur' et la 'hauteur' que j'ai définies et réduites. J'ai essayé de mettre à l'intérieur de la DIV, mais il ne prend alors assez de largeur pour contenir le nbsp.
J'ai essayé d'ajuster l'affichage à toutes les valeurs possibles (y compris les "obscures" comme "table-rangée", "run-in", "compact", etc.), mais sans aucune chance. Est-il même possible de créer un DIV avec le même comportement de mise en page qu'un IMG?
Je suis ouvert à avoir quelque chose de plus compliqué qu'un simple DIV, mais j'ai essayé les choses évidentes là (une DIV dans une autre où la DIV intérieure est affichée: bloc avec l'ensemble externe à afficher: inline) mais je n'ai pas trouvé une combinaison qui fonctionne.
Il y a toujours des choses spécifiques que je peux faire en dehors du IMG/DIV remplacé pour obtenir la mise en page que je veux, mais mon but est d'avoir un mécanisme auto-CSS-sprite générique qui fonctionne indépendamment du reste du HTML.
C'était rapide! –