Bonjour

Voila lorsque je passe sur mon path tous fonctionne mais si je passe sur le texte du path sa ne fonctionne pas, est-il possible en Css ou en Javascript de remédier à se problème?

mon
Code CSS : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
   .map__image {
    	position: absolute;
    	top: 90px;
    	left: -90px;
    	right: 0px;
    	bottom: 0;
    	/*cadre rouge autour de la carte*/
    	border: 1px solid red;
    	width: 940px;
    	height: 640px;
    	margin-left: 100px;
    }
    .map__image path {
    	fill: #19191f;
    	stroke: #cc4646;
    	stroke-width: 0.5px;
    	transition: fill 0.1s;
    }
    .map__image path:hover {
    	fill: #0000FF;
    	stroke: #cc4646;
    }
    .map__image svg {
    	height: 1000px;
    	width: 1020px;
    }
    .map {
    	overflow: hidden;
    }
    path~text {
    	fill: #e8e809;
    	font-size: 14px;
    }
    path:hover~text {
    	fill: #fdfefe;
    	font-weight: bold;
    	font-size: 14px;
    }
    /*Pas de nom sur la carte*/
    .texte {
    	visibility: hidden;
    }

mon
Code HTML : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
	<div class="map" id="map">
		<div class="map__image">
			<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 1200 1200">
				<g>
					<a id="region-01" xlink: href="Aveyron/alpuech.html" target="myframe" data-img="img1" data-txt=" Alpuech">
						<path id="01" title="Alpuech" class="st0" d="M697.3,432.9 659.8,421.1 639.3,400.7 623.8,396.5 575.5,354.1 530.1,342.3 518.8,333 521.5,326.9 534.2,323.5 537.5,311.5 558.8,316.9 581.6,314 617,372.8 664.2,376.6 684.6,403.7 " />
						<text transform="matrix(1 0 0 1 537 338)">
							<tspan x="0" y="0" class="texte">Alpuech</tspan>
						</text>
					</a>
				</g>
				<g>
					<a id="region-02" xlink: href="Aveyron/brommat.html" target="myframe" data-img="img2" data-txt=" Brommat">
						<path id="02" title="Brommat" class="st0" d="M285.5,345.6 279,342.4 280.6,312.5 291.9,295.4 284.6,283.8 286.4,271 283.9,264.8 255.3,253 252.2,202.6 257.3,207.6 270.6,200.7 272.7,175.5 316.9,149.2 332.8,149.2 350.3,136.2 373.3,131 392.5,142.1 405.3,178.6 392.4,185.9 379.2,216.9 351.3,225.6 325.6,300.7 299.5,333.4 285.4,339.1 " />
						<text transform="matrix(1 0 0 1 298 212)">
							<tspan x="-5" y="0" class="texte">Brommat</tspan>
						</text>
					</a>
				</g>


Je vous remercie d'avance.
Max