1 pièce(s) jointe(s)
Responsive design incohérent
Bonjour,
je suis en train de créer un site web ; pour la taille de mes <div> j'utilise bien évidemment des valeurs en "%" et jusque là tout fonctionnait bien!
Mais la page d'accueil me pose quelques soucis :(
La structure de ma page est représentée ci-dessous:
Pièce jointe 204770
J'ai donc:
un <header> une <div1>
Code:
1
2
3
| height: 33%;
width: 100%;
padding-top: 2%; |
contenant une <img> une <div2>
Code:
1
2
| height: 49%;
width: 100%; |
un <footer>
Code:
1
2
| height: 5%;
width: 100%; |
J'ai également le code CSS suivant:
Code:
1
2
3
4
5
6
| html,body {
margin: 0px;
padding: 0px;
outline: 0px;
height: 100%;
} |
Sur mon écran toutes les pages prennent bien 100% de la taille disponible, mais dès que la taille du navigateur change (mode plein écran, suppression de la barre des favoris,...) ou dès que je passe sur un écran de taille différente, le contenu ne prend plus les 100%... :(
Le footer remonte ou une barre blanche apparait sous celui-ci... :help:
Merci d'avance!
P.S: Si quelqu'un sait comment diminuer la taille de l'image de mon post, ça serait plus lisible :aie:
