Deux cadre cote à cote
Résolu
Bonjour,
Petit soucis du jour, j'ai deux cadres un à gauche, un autre à droite. Ils sont bien espacés tout va bien seulement probleme, lorsque je réduis ma page internet, le cadre de droite vient caché le cadre de gauche. Moi je veux que le cadre de droite reste à sa place!!
Comment faire svp?
Petit soucis du jour, j'ai deux cadres un à gauche, un autre à droite. Ils sont bien espacés tout va bien seulement probleme, lorsque je réduis ma page internet, le cadre de droite vient caché le cadre de gauche. Moi je veux que le cadre de droite reste à sa place!!
Comment faire svp?
2 réponses
-
il doit y en avoir un en position fixed ou absolute et l'autre sans position ou bien en relative
donc soit tu mets les 2 cadres en display inline-block et position relative
(il passera en dessous quand la page se reduit)
soit tu mets un min-width a body mais ce ne sera pas responsive
(un scroll horizontal apparaitra)
-
Salut alors ta première solution reste je le pense la meilleure car je souhaite qu'il reste responsive mais le probleme c'est que mes cadres dans ce cas ne sont jamais l'un en face de l'autre. Je te montre mon code css au cas ou ça aiderait:
.cadre1
{
display:inline-block;
position:relative;
padding:0.5em;
border: 3px solid;
border-radius: 10px;
margin-top:3%;
margin-left:15%;
margin-right:50%;
background-color: rgb(138,194,230);
color: white;
float:left;
}
.cadre2
{
display:inline-block;
position:relative;
padding:0.5em;
border: 3px solid;
border-radius: 10px;
margin-top:3%;
margin-right:25%;
margin-left: 40%;
background-color: rgb(0,96,169);
color: white;
float:left;
}-
met un width a tes cadres et il faut que le total des width et des margin left et right et des borders soient inférieurs a 100% sans oublier le white space inhérent au inline-block (environ 4px entre chaque bloc)
la rien qu'en margin tu as 130%.donc des margins supérieurs au width d'un page !
en général avec un inline-block on peux mettre un width en % et un min-width en px
dernier truc retire float left c'est soit inline-block soit float mais pas les 2 -
-
-
-
-
