Je ne pense pas qu'il y ait une solution native
en CSS pour adapter automatiquement une balise <div>
à la taille de son image de fond. Il va falloir feinter quelque peu.
L'une des solutions est de positionner la même image que celle de fond, dans le conteneur, puis ne pas l'afficher, via la propriété CSS visibility
:
<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8">
<title>Comment adapter un div à la taille de son image de fond ?</title>
</head>
<body>
<style>
.conteneur {
background-image: url(https://www.1formatik.com/os.jpg);
background-repeat: no-repeat;
}
.image {
visibility: hidden;
}
</style>
<div class="conteneur">
<img src="https://www.1formatik.com/os.jpg" class="image" alt="">
</div>
</body>
</html>