disposition de DIV : je bloque malgré les tutoriels |
|
| Voir le sujet précédent :: Voir le sujet suivant |
| Auteur |
Message |
cedricbujon
frontpage mioche
|
 disposition de DIV : je bloque malgré les tutoriels , Posté le: 16-04-2004 0:22 |
|
|
Bonjour à tous, je galère pas et je navigue donc sur plusieurs forums...
j'ai lu pas mal de tutoriels, visité plusieurs sites mais je n'arrive pas à obtenir ce que je souhaite, c'est à
dire une page qui s'adapte à la taille du navigateur.
j'ai créé un design sous illustrator que j'ai ensuite découpé en tranches :
j'ai donc organisé ma page web et ma feuille CSS (d'après les recommandations) selon ce schéma :
J'ai les conteneurs entete et conteneur .
Ensuite dans le conteneur conteneur, j'ai 2 autres conteneurs :
mommenu
partenaires
les différentes tranches réalisées sous illustrator devient donc les images de fond des diiérents bloc.
Je souhaite donc avoir ma page étirable avec en particulier les blocs :
...milieu, et le bloc contenu qui s'adapte à l'espace restant de la page avec un overflow.
mais je commence à expérimenter les CSS ; voici les codes:
| Citation: |
HTML
<body>
<div class="entete">
<div class="entetegauche"></div>
<div class="entetemilieu"></div>
<div class="entetedroit"></div>
</div>
<div class="conteneur">
</div>
</body>
| Citation: |
body {
background-color: #9999CC;
PADDING: 0px;
MARGIN: 0px;
WIDTH: 100%;
HEIGHT: 100%;
}
.entete {
height:99px;
WIDTH: auto;
background-color: #00CC00
}
.conteneur {
height: 100%;
WIDTH: auto;
background-color: #FFCC00;
}
.entetegauche {
width:266px;
height:99px;
background: url(images/images/Hautgauche.gif);
float: left;
}
.entetedroit {
width:235px;
height:99px;
background: url(images/images/Hautdroit.gif);
float: right;
}
.entetemilieu {
height:99px;
background: url(images/images/Hautmilieu.gif);
WIDTH: auto;
margin-left: 267px;
margin-right: 236px;
float: left; } |
|
mais, maintant je suis perdu car :
1 - pourquoi mon bloc conteneur n'apparaît pas
2 - pourquoi le div hautmilieu n'apparait pas sauf si je met hautdroit en absolu (ou si je met pour
hautmilieu à width: 100% j'ai hautdroit renvoyé à la ligne pourtant dans le conteneur entête défini
par sa hauteur).
3 - le div hautmilieu se met en place correctement si je le déclare après les 2 autres div gauche et droit
(qui contiennent float ???), pourquoi ?
4 - il reste un espace autour de entetemilieu : pourtant dans body, margin et padding = 0 ???
5 - le conteneur s'adapte au texte !!!
Par contre, si je transforme en ID au lieu de class, cela fonctionne (sauf que la calque
conteneur à 100% est à la taille du navigateur mais ne prend pas l'espace restant il prend la taille
visible du navigateur donc dépasse puisqu'il y a le 1er bloc (le 1er = 99 pixels donc il dépasse de 99 pixels)....
) ????????????
Aussi, en réduisant la taille du navigateur le bloc entete ne garde pas sa hauteur (elle est fixée)???
mais je n'ai aucun changement de comportement avec le bloc hautmilieu
alors là, plus j'avance, plus je décroche ....................
Merci de vortre aide |
|
|
cedricbujon
frontpage mioche
|
| disposition de DIV : je bloque malgré les tutoriels , Posté le: 17-04-2004 1:05 |
|
|
j'avance dans mes découvertes des CSS, mais, je me heurte à différents problèmes dont en particulier ceux-ci :
j'ai rajouté un bloc GLOBAL ;
1: Si j’indique height = 100 % pour un bloc il prend la taille de l’écran ; c’est normal, ok, en particulier pour le bloc GLOBAL. Mais si je l’applique aux autres blocs, il prennent effectivement la taille de l’écran (donc dépassent comme il y a d’autres blocs comme pour le bloc MONMENU) : ma question est comment faire pour qu’un bloc s’étende en hauteur dans tout son bloc parent ??
2: J’ai un espace (de 3px) qui apparaît sous IE mais pas Mozilla firevox à droit et à gauche du bloc ENTETEMILIEU malgré l’ajout de margin, padding et border à 0 ??
3: J’ai positionné les blocs ENTETEGAUCHE et ENTETEDROIT avec float : si je ne déclare pas dans body le bloc ENTETEMILIEU en dernier, celui-ci descend. Pourquoi alors que j’ai fixé une hauteur du bloc parent ENTETE ?
Merci de votre aide. |
|
|
nomade
frontpage mioche
|
| disposition de DIV : je bloque malgré les tutoriels , Posté le: 16-06-2004 13:55 |
|
|
Moi aussi je suis en pleine découverte des CSS et même si t'es un peu plus avancé que moi, je trouve que tu t'attaques à gros dès le départ 
Je ne peux pas répondre à tous tes problèmes, cependant un truc qui me fait tilter c'est ton utilisation des blocs en positionnement float. Tu ne peux pas jouer avec aussi facilement car en float les blocs sortent du flux normal, ainsi un bloc conteneur qui contient des blocs en float sera considéré comme vide, ce qui doit poser des problèmes de mise en page dans ton cas.
cf : http://incongru.webdynamit.net/PositionnementCss
Bon courage! |
|
|
|
  |
Accueil Forum
-> css |
Toutes les heures sont au format GMT + 1 Heure
|
| Page 1 sur 1 |
|
 S'enregistrer
 Profil
 Se connecter pour vérifier ses messages privés
 Rechercher
 Membres
 FAQ
 Connexion
|
