Voici mon problème / question / scénario / quelque chose que je n'arrive pas à comprendre depuis trois heures maintenant.
Voici le css :
header {
width:100%;
height:95px;
color:#FFF;
position:fixed;
width:100%;
background:#3b5998;
display:block;
z-index:99999;
top:0px;
border-bottom:1px solid ##133783;
float:left;
}
.inner-header {
margin:0px auto !important;
width:100%;
height:95px;
max-width:1400px;
min-width:700px;
padding:0 10px 0 10px;
}
.header-logo{
padding-right:10px;
width:100% auto;
}
img#header1280-1366 {
width:100%;
}
.header-logo, .xbdlogo {
float:left;
}
.header-adsense {
float:left;
}
.xbdlogo {
top:-100px;
display:block;
position:relative;
-webkit-transition:all 0.3s ease-in-out;
-moz-transition:all 0.3s ease-in-out;
-o-transition:all 0.3s ease-in-out;
transition:all 0.3s ease-in-out;
overflow:auto;
margin-right:10px;
}
.header-logo:hover + .xbdlogo {
top:30px;
}
.header-adsense {
padding-top:2px;
}
Il s'agit d'un en-tête de site web.
Le problème :
L'en-tête se compose de 3 éléments, les deux logos d'en-tête et les annonces adsense.
Je veux le rendre réactif, chaque fois que l'utilisateur redimensionne la fenêtre, est-il possible que le PNG BENDAGGERS se redimensionne en une image plus petite. J'ai réglé la largeur à 100 %, mais cela ne fonctionne pas.
Une suggestion sur la manière de le faire ?
Aidez-nous ! J'apprécie votre aide ! :)