Merci two3d

voila j y suis enfin arrive
j ai change dans le css ceci


[code]reseau-sociaux-blogger {
float: left;
width: 20%;
height: 35%;
margin-top: 1%;
margin-right: 10px;
margin-bottom: 10px;
margin-left: 2%;
}


.reseau-sociaux-youtube {
float: left;
width: 20%;
height: 50%;
margin-top: 2%;
margin-right: 10px;
margin-bottom: 10px;
margin-left: 10px;
max-width: 100%;
max-height: 100%;[/code]

regarde dans ta console si le max-width/height est bien prix en compte (F12) ou clic droit sur l'élément > examiner

100%!important (bootstrap est le champion des "!important", il faut peut être le contrer ;)

merci pour la reponse
oui j ai essaye les deux

max-height aussi à 100%

merci pour l aide
mais cela ne fonctionne pas
en fait le soucis que j ai est que l emplacement des deux petites images bougent trop en petites écrans
jusque 400px de largeur tout ce passe +-bien

Mets des max-width à 100% sur tes images.

bonsoir a tous
je recherche un moyen pour rendre responsive en boostrap
une bannière avec l intérieur de cette bannière deux autres images qui représente les logos de youtube et blogger
j ai essaye plusieurs choses mais rien ne fonctionne
mon dernier essai est celui ci , cela fonctionne sauf pour les petits écrans
ou la j ai les icones de blogger et youtube qui ne reste plus dans ma bannière


voici mon code html

merci pour l aide

css
[code]<div class="parent"><img src="./image/top_image_perle-peche.jpg" alt="Nature" class="responsive">
<div class="child1"></div>
<div class="child1 child2">
<div class="reseau-sociaux">
<div class="reseau-sociaux-youtube">
<a href="https://www.youtube.com/playlist?list=PLGsAPXsvnTPUVWSZUiQ_GwZz_-_z2i3f1" target="_blank"><img src="./image/youtube-peche-perle.png" alt="Nature" class="responsive"></a>
</div>
<div class="reseau-sociaux-blogger">
<a href="http://phil/" target="_blank"><img src="./image/blogger-peche-perle.png" alt="Nature" class="responsive"></a>
</div>
</div>
</div>
</div>[/code]

voici le code css
[code].responsive {
width: 100%;
height: auto;
}

.parent {
position: relative;
margin-bottom: 20px;
}

.child1 {
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
opacity: 0.7;
}

.child2 {
z-index: 1;
margin: 0px;
background: green;
width: 45%;
height: 40%;
}

.reseau-sociaux {
width: 100%;
}

.reseau-sociaux-youtube {
float: left;
width: 20%;
height: 50%;
margin-top: 10px;
margin-right: 10px;
margin-bottom: 10px;
margin-left: 10px;
max-width:100%;
max-height:100%;
}

.reseau-sociaux-blogger {
float: left;
width: 20%;
height: 35%;
margin-top: 10px;
margin-right: 10px;
margin-bottom: 10px;
margin-left: 10px;
}
/* fin css pour la banniere*/[/code]


voici l image et les deux logos

https://zupimages.net/up/21/11/r7to.jpg