Limite verticale d'un bloc (div) ??
Limite verticale d'un bloc (div) ?? - Web design - Graphisme
Marsh Posté le 16-06-2005 à 14:40:24
C'est bon, avec un float: left dans la classe global, ça passe.
Marsh Posté le 16-06-2005 à 15:37:07
Bon je me suis planté... Si le contenu est trop important j'ai toujours le même problème. Pour info, le bloc global prend fin à la limite de mon écran et non pas à la limite de son contenu (sous Mozilla).
Quelqu'un peut m'aider?
Marsh Posté le 16-06-2005 à 15:53:21
tente ptete le meme topic dans la categorie programation 
sinon aucune idée ^^
Marsh Posté le 16-06-2005 à 16:02:51
c'est le 100% qui pose problème à mon avis, t'as pas essayé de mettre une valeur en pixels?
---------------
| .:: www.wizopunk-art.com - Développement web ::. |
Marsh Posté le 16-06-2005 à 16:09:02
Oui c'est sur c'est le 100% qui pose problème. Pour Mozilla, 100% c'est la hauteur en pixel de mon écran, contrairement à IE pour qui 100% c'est la hauteur total (mon écran s'il n'y a pas bcp de contenu ou l'ensemble du contenu s'il est supérieur à la hateur de mon écran).
Je viens d'essayer avec min-height:100% et du coup ça passe sur Mozilla mais pas sur IE...
Y a bien une solution : créer un autre bloc au dessus de global, mais ça fait un peu bricolage et ça me plait pas des masses...Si quelqu'un a une solution + propre 
.
EDIT : mettre une valeur en pixels n'est pas une solution non plus parce que je veut pas un gros blanc sous mon contenu si celui-ci n'est pas assez important.
Message édité par electroger le 16-06-2005 à 16:10:03
Marsh Posté le 16-06-2005 à 16:12:14
Ah, je pensais que ton global tu t'en servais comme moi. Manifestement tu lui en demandes plus que moi 
---------------
| .:: www.wizopunk-art.com - Développement web ::. |
Marsh Posté le 16-06-2005 à 16:14:57
| wizopunker a écrit : Ah, je pensais que ton global tu t'en servais comme moi. Manifestement tu lui en demandes plus que moi |
C'est à dire?
Marsh Posté le 16-06-2005 à 16:17:50
Je crois que c'est plutot un truc avec les margin 
En fait tu définis pas la hauteur, tu lui dis "laisse une marge de 10px en bas"... enfin c la théorie maintenant amuse toi
Marsh Posté le 16-06-2005 à 16:22:10
| Danamir_ a écrit : Je crois que c'est plutot un truc avec les margin |
Je peux me tromper mais je crois bien qu'il n'y a aucun rapport . Si le contenu est assez important je veux bien croire qu'il laissera une marge en bas (genre 10px comme tu dis), mais si y a pas grand chose sur ma page ça changera rien.
Marsh Posté le 16-06-2005 à 16:35:20
mets ton .global en position: absolute;
edit : et enleve les float de ton .haut si tu veux pas qu'il se fasse bouffer par le contenu
Message édité par Mattc le 16-06-2005 à 16:37:19
---------------
"Welcome to the soldier side, where there's no one here but me...."
Marsh Posté le 16-06-2005 à 16:43:05
Oué my bad j'avais pas remarqué que par défaut les div prennent toute la largeur et que du coup avec margin gauche et droite ca les fait varier en taille, mais que ca marche pas pour la hauteur 
Marsh Posté le 16-06-2005 à 16:54:48
| Mattc a écrit : mets ton .global en position: absolute; |
Non, le problème est toujours le même : si le contenu est trop important (supérieur à la hauteur de mon écran) mon bloc ne va pas jusqu'en bas.
Marsh Posté le 17-06-2005 à 18:15:29
| electroger a écrit : Non, le problème est toujours le même : si le contenu est trop important (supérieur à la hauteur de mon écran) mon bloc ne va pas jusqu'en bas. |
bizarre, j'ai testé avec ce que tu as donné et ca marchait
---------------
"Welcome to the soldier side, where there's no one here but me...."
Marsh Posté le 18-06-2005 à 00:10:19
y a pas une question d'overflow:auto qu'il faudrait spécifier pour ton contenu ?
Marsh Posté le 18-06-2005 à 22:30:38
quand je vois la gueule de la source de la page, j'ose pas lire les conseils ![[:suri]](https://forum-images.hardware.fr/images/perso/suri.gif "[:suri]")
Marsh Posté le 19-06-2005 à 14:58:22
Le truc que tu essayes de faire (donc haut-contenu-bas), je pense avec haut et bas fixe, et barre de défilement sur contenu est complètement impossible à faire sous Internet Explorer, à cause de sa pauvre gestion des normes 
Donc c'est possible de le faire, il faut juste savoir que le rendu sera un peu différent sous IE...
Marsh Posté le 20-06-2005 à 10:52:01
Ouais, je vais en rester là. J'ai un rendu correct sur Mozilla, mais c'est pas le cas pour IE.
Merci tlm 
.
Marsh Posté le 20-06-2005 à 17:24:10
| Gnub a écrit : quand je vois la gueule de la source de la page, j'ose pas lire les conseils |
0 errors / 307 warnings ![[:matleflou]](https://forum-images.hardware.fr/images/perso/matleflou.gif "[:matleflou]")
---------------
"Welcome to the soldier side, where there's no one here but me...."
Marsh Posté le 21-06-2005 à 16:55:22
Reply
Sujets relatifs:
- [Xpress/PDF] Problème de couleur entre image et bloc
- Taille limite des images pour GIMP 2 ?
- Copie en bloc avec Indesign
- Dessins au bloc-note
- bloc image et bloc texte sur X press
- Justification verticale avec Indesign CS
- comment ancrer un bloc image au texte ds X.Press 4
- bloc de texte dynamique pour X-Press
- le frontiére/limite dans l'art?
- bloc ancré xpress
Marsh Posté le 16-06-2005 à 14:19:32
Bonjour tout le monde !
) voici un p'tit schéma :
Je bosse sur un site qui entièrement construit avec des div et une feuille de style qui organise le tout.
En gros ça donne ça :
<BODY>
<div class="global">
<div class="haut">
MENU EN HAUT DE LA PAGE
</div>
<div class="menu">
LE MENU SECONDAIRE
</div>
<div class="contenu">
LE CONTENU DU SITE
</div>
<!-- TABLEAU DE COPYRIGHT -->
<div class="bas">
BAS DE PAGE
</div>
</div>
</body>
Bref, c'est assez simple. J'ai une classe "global" qui contient le haut, le menu, le contenu et le bas de page. Ce bloc global a une largeur absolue de 750px et est aligné à gauche. J'ai attribué une couleur de fond à mon body et une autre couleur de fond à la classe "global". Le problème c'est que la couleur attribuée à ma classe "global" de va pas jusqu'en bas de la page (body et global ont une hauteur de 100%). Bon comme je sens que c'est pas clair (
Pour le CSS :
body {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
margin: 0px;
background-color: #333333;
height: 100%;
}
.global {
width: 750px;
border-right: 2px solid #333333;
background-color: #C1AF87;
height: 100%;
border: 3px solid red;
}
.haut {
width: 750px;
float: left;
background-image: url(images/style2/bouton1_bg.jpg);
background-repeat: no-repeat;
border: 3px solid yellow;
}
.menu {
float: left;
width: 262px;
padding: 10px;
padding-top: 220px;
background-image: url(images/style2/logo.jpg);
background-repeat: no-repeat;
margin-right: 20px;
border: 3px solid gray;
}
.contenu {
padding: 10px;
margin-left: 280px;
border: 3px solid blue;
}
.bas {
text-align: center;
float: left;
width: 750px;
height: 82px;
font-weight: bold;
color: #333333;
font-size: 13px;
text-indent: 150px;
border: 3px solid green;
}
Est ce que quelqu'un sait comment résoudre ce problème?