Deux cadre cote à cote
Résolu
varalax
Messages postés
61
Date d'inscription
Statut
Membre
Dernière intervention
-
varalax Messages postés 61 Date d'inscription Statut Membre Dernière intervention -
varalax Messages postés 61 Date d'inscription Statut Membre Dernière intervention -
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?
A voir également:
- Deux cadre cote à cote
- Point vert a cote de la batterie - Accueil - Protection
- Comment mettre deux textes côte à côte sur word - Guide
- Pourquoi mon casque bluetooth ne marche que d'un coté - Forum Casque et écouteurs
- Croix a cote contact snap - Forum Snapchat
- Livre de lecture cp 1990 cote d'ivoire pdf ✓ - Forum PDF
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)
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;
}
.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
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