[CSS]Problème d'affichage
Nieli
Messages postés
85
Statut
Membre
-
artragis Messages postés 510 Statut Membre -
artragis Messages postés 510 Statut Membre -
Bonjour,
Voila mon problème :
Je suis en train de réaliser un site.
Sur ce site, j'ai une banière ,
.haut {
height:65px;
width:100%;
}
un menu à gauche :
.gauche {
margin-top:0px;
background-color: #3AAD6C;
text-align:center;
height:100%;
width:15%;
position:absolute;
}
un corps :
.corps {
margin-left: 16%;
margin-top: 20px;
border: thin solid Black;
min-height:1000px;
width:100%;
}
et dans ce corps , deux parties que je veux côte à côte.
.contenu {
padding-left : 40px;
margin-top : 50px;
min-height:1000px;
float:left;
width:35%;
}
et
.pictos {
text-align:center;
margin-top : 50px;
padding-bottom:10px;
float:left;
width:500px;
}
j'ai donc mis des float:left avec des dimensions prédéfinies (j'aurai pu mettre des pourcentage mais bon peu importe).
Le problème est que le corps à un cadre (border), et apparement le float:left fait passer les div en absolute , je veux dire que le corps ne se dimensionne pas selon la taille des div qui sont a l'interieur et le cadre coupe le texte.
Je voudrais savoir si vous avez une solution à mon problème si vous vous y connaissez en CSS.
(désolé si mon code est sale je débute).
Merci d'avance.
Nieli
Voila mon problème :
Je suis en train de réaliser un site.
Sur ce site, j'ai une banière ,
.haut {
height:65px;
width:100%;
}
un menu à gauche :
.gauche {
margin-top:0px;
background-color: #3AAD6C;
text-align:center;
height:100%;
width:15%;
position:absolute;
}
un corps :
.corps {
margin-left: 16%;
margin-top: 20px;
border: thin solid Black;
min-height:1000px;
width:100%;
}
et dans ce corps , deux parties que je veux côte à côte.
.contenu {
padding-left : 40px;
margin-top : 50px;
min-height:1000px;
float:left;
width:35%;
}
et
.pictos {
text-align:center;
margin-top : 50px;
padding-bottom:10px;
float:left;
width:500px;
}
j'ai donc mis des float:left avec des dimensions prédéfinies (j'aurai pu mettre des pourcentage mais bon peu importe).
Le problème est que le corps à un cadre (border), et apparement le float:left fait passer les div en absolute , je veux dire que le corps ne se dimensionne pas selon la taille des div qui sont a l'interieur et le cadre coupe le texte.
Je voudrais savoir si vous avez une solution à mon problème si vous vous y connaissez en CSS.
(désolé si mon code est sale je débute).
Merci d'avance.
Nieli
A voir également:
- [CSS]Problème d'affichage
- Affichage double ecran - Guide
- Problème affichage fenêtre windows 10 - Guide
- Windows 11 affichage classique - Guide
- Problème affichage facebook ✓ - Forum Facebook
- Problème affichage clavier android - Guide
2 réponses
ton code en lui même aurait été accepté par les navigateur de la manière dont tu le voulais si il n'y avais pas le float.
un conseil prend l'habitude de signaler position : (relative, absolute, inherit...) pour que le navigateur n'ait pas à choisir lui même.
un conseil prend l'habitude de signaler position : (relative, absolute, inherit...) pour que le navigateur n'ait pas à choisir lui même.
J'ai essayé avec :
.pictos {
text-align:center;
margin-top : 50px;
padding-bottom:10px;
float:left;
position:relative;
width:500px;
}
et
.contenu {
padding-left : 40px;
margin-top : 50px;
min-height:1000px;
float:left;
position:relative;
width:35%;
}
==> Même chose le corps ne se redimensionne pas
et les deux sans les floats
==> L'un en dessous de l'autre
merci pour l'attention que tu portes à mon problème
Nieli
.pictos {
text-align:center;
margin-top : 50px;
padding-bottom:10px;
float:left;
position:relative;
width:500px;
}
et
.contenu {
padding-left : 40px;
margin-top : 50px;
min-height:1000px;
float:left;
position:relative;
width:35%;
}
==> Même chose le corps ne se redimensionne pas
et les deux sans les floats
==> L'un en dessous de l'autre
merci pour l'attention que tu portes à mon problème
Nieli
Même en spécifiant au corps une largeur de 1000px et à contenu et pictos une largeur de 200px.
:/