Taille de la DIV à la taille de l'image d'arrière-plan

Question

J'ai un DIV avec le style suivant

.vplayer-container .logo 
{ 
position: absolute; 
bottom: 50px; 
right: 10px; 
background: url(../img/logo.png) no-repeat; 
border: 1px solid #000000; 
max-width: 50px; 
max-height: 50px; 
} 

Je veux que la taille de DIV est le même que l'image d'arrière-plan. Puisque l'image bg change, je veux qu'elle soit réglée automatiquement. Je peux utiliser JavaScript, mais je préfère un moyen CSS pour cela.

Je cible les navigateurs HTML5 qui sont FireFox, Webkit et Opera.

Merci

Réponse:

Avec Kyle Sevenoaks indice, vous pouvez le faire en plaçant un élément d'image à l'intérieur du DIV.

<div> 
<img src="url"> 
</div> 

Supprimez la propriété Background et aucun autre style n'est nécessaire.

Answer 1

CSS ne peut pas faire cela, le div obtient ses dimensions à partir du contenu en son sein. L'image de fond est purement une marque de style.

Vous devriez être en mesure de le faire avec Javascript, trouver la hauteur et la largeur et de les injecter dans un style en ligne devrait le faire :)

Vous pouvez également utiliser une balise <img> dans le .logo div. Cela produirait ce que vous avez l'intention.

Answer 2

CSS ne peut pas faire cela pour l'image d'arrière-plan.

Answer 3

Ceci est impossible avec du CSS pur. Je pense que vous devez le faire avec JavaScript. Avez-vous vraiment besoin de cela pour être dynamique? Je pense que c'est moins de travail de changer deux valeurs dans la feuille de style si le logo change.