Problème de hauteur de div et de margin-bottom.

HTML5, CSS3, Javascript, support des mobiles... Que penser de votre site ? Vous manquez d'informations pour la construction d'un site qui puisse s'afficher correctement partout ? C'est un problème simple, un peu complexe ? Venez ici !
salamnavi
Arias
Messages : 3
Inscription : 21 déc. 2009, 17:27

Problème de hauteur de div et de margin-bottom.

Message par salamnavi »

Bonjour à tous voila je suis en trin de créer mon site web et j'ai un petit problème je m'explique :

Mon site a une largeur défini ( 1000 px) centré dans le navigateur.
Les haut de page et pied de page sont deux balises externes au conteneur celui si contient 3 autres balises :
- une balise div menu
- une balise contenu
- une balise pub

donc voici mon problème j'aimerai que la hauteur de mon site soit au minimum égale à la hauteur de mon navigateur et que si les éléments contenus dans les balises menu, contenu ou pub sont plus importantes que la hauteur du navigateur, se seront celle ci qui serve de repère pour la hauteur du site ( la plus grande de l'une de ces trois balises ). J'aimerais aussi qu'en dessous de mon pied de page il y est une marge comme au dessus. Merci pour vos futures réponses.

Voici ma feuille de style :
Code:

Code : Tout sélectionner

@charset "utf-8";
/* CSS Document */

html, body 
{    
    margin: 0px;
    padding: 0; 
    height: 100%; 
    background-color:#000000;
}

div#hautpage
{
    margin-top: 10px;
    width: 1000px;
    height: 100px;
    background:#000099;
    margin-left: auto;
    margin-right: auto;
}

div#conteneur
{ 
    width: 1000px;
    height: 100%;
    background:#0000CC;
    margin-left:auto;
    margin-right:auto;
}

div#menu
{
    float:left;
    width: 150px;
    height: 100%;
    background: #0066FF;
}

div#pub
{
    float:right;
    width: 150px;
    height: 100%;
    background: #0066FF;
}

div#contenu
{
    overflow: hidden;
    height: 100%;
    background: #00CCFF;
}

div#piedpage
{
    width: 1000px;
    background-color: #EFEFEF;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 10px;
}
et la mon document php
Dernière modification par Asumbaa le 31 déc. 2009, 18:13, modifié 1 fois.
Raison : Lien publicitaire
calimo
Animal mythique
Messages : 14118
Inscription : 26 déc. 2003, 11:51

Re: Problème de hauteur de div et de margin-bottom.

Message par calimo »

Salut,
salamnavi a écrit :Mon site a une largeur défini ( 1000 px) centré dans le navigateur.
Pas très malin ça. Que se passe-t-il pour les utilisateurs qui n'ont pas un écran de 1000px de largeur ? Ils devront scroller latéralement, c'est pas terrible… Et pour ceux qui en ont 1920, cela veut dire que 920px sont perdus et que ton site ressemble à un timbre poste ?
Pourquoi ne pas adopter un design plus flexible qui s'adapte à la largeur d'écran des utilisateurs ? Cela me semblerait préférable…

Pour ton problème, tu peux regarder du côté de la propriété min-height, à appliquer sur body et/ou html. Ceci dit, j'ai souvenir d'avoir essayé et abandonné, tant il s'agit de quelque chose d'affreusement compliqué (à l'époque d'IE6 où les min-height n'existaient pas sur celui-ci… je ne sais pas ce qu'il en est maintenant).

Bonne chance :wink:
Répondre

Qui est en ligne ?

Utilisateurs parcourant ce forum : Google [Bot] et 2 invités