Rendre invisible une partie de div

[City-zen]

Bonjour,

Je m'explique:

Code :

1
2
3
4
5
6
 
<div class="global">
    <div class="bloc_hotel">
	<div class="title">ACCUEIL</div>
    </div>
</div>

Le div Global possède une image pour background.
Le block hotel à un background color blanc.
Le div title est une toute petite partie du block hotel et j'aimerais qu'il rende transparent le bloc_hotel afin d'avoir la partie de l'image du blog global correspondante comme background.

Il me semble peu probable qu'il y ai une solution à ce problème.

Mais si quelqu'un a une idée, je suis preneur.

Merci

[briceparmentier]

Salut

Peut-être comme ça :

Code :

1
2
3
4
<div class="global">
    <div class="bloc_hotel"></div>
    <div class="title">ACCUEIL</div>
</div>

Après sinon, est-ce obligé que ton bloc_hotel ait un background blanc ?

Bonne continuation

[eckerdecker]

Tel que tu le décris effectivement il n'y a pas de solution.

En revanche, suivant ton image de fond et le placement de tes éléments, tu peux peut-être simplement mettre la même image de fond dans ton div.global et ton div.titre et jouer sur le background-position dans ton div.titre pour simuler l'effet souhaité.

Exemple :

Code :

1
2
3
4
5
6
7
8
9
10
11
12
 
.global {
background:url(image.jpg) repeat left top;
padding:10px;
}
.bloc_hotel {
background:white;
padding:10px;
}
.titre {
background:url(image.jpg) repeat -20px -20px;
}

Le div.titre est décalé de 20 pixels du haut et de la gauche de ton div.global (deux fois le padding de 10 pixels), aussi pour faire correspondre le fond de ton div.global et celui de ton div.titre tu décales le fond de 20 pixels vers le haut et vers la gauche.

A voir si cela est applicable dans ton cas.

[City-zen]

L'image évolue selon le contenu de la page donc cela ne peut pas s'appliquer à mon cas...