Chtite colle : un div qui reste fixe en bas... - HTML/CSS - Programmation
Marsh Posté le 18-09-2003 à 11:52:06
Utilise la solution 1 et ajoute une marge à la partie 1 de la taille de la partie 2
Comme ça, une partie de la partie 1 sera cachée par la partie 2 mais ce sera la marge.
Marsh Posté le 18-09-2003 à 12:04:34
Je vois mal comment tu ferait ça avec des tableau.
Marsh Posté le 18-09-2003 à 12:06:52
Déjà essayé, et ça ne marche pas. Mais merci de t'intéresser à mon problème...
Le code :
Code :
|
et la feuille de style :
Code :
|
Marsh Posté le 18-09-2003 à 12:16:08
fadenreturns a écrit : Je vois mal comment tu ferait ça avec des tableau. |
Très facilement :
Comme ça :
Code :
|
et la feuille de style :
Code :
|
Marsh Posté le 18-09-2003 à 12:31:55
J'en suis déjà à 2 cas où l'on ne peut ABSOLUMENT PAS se passer des tables pour la mise en page.
1) ça ne remet nullement en question la validité du code XHTML 1.1 (il suffit de mettre les attributs dans les CSS).
2) Le respect de la "philosophie div" pour la mise en page ne doit ABSOLUMENT PAS LIMITER les possibilités de création. J'insiste bien sur ce point.
3) Qu'on ne vienne plus dire : les tableaux pour la mise en page "c'est mal". Oui, en général, c'est mal, mais dans certains cas, c'est OBLIGATOIRE.
Pour le deuxième cas ou l'utilisation de table est indispensable, se reporter ici : http://forum.hardware.fr/forum2.ph [...] h=&subcat=
Et sinon, pour une solution concernant mon problème, je reste évidemment ouvert à toutes vos propositions...
Marsh Posté le 18-09-2003 à 12:38:04
tu peux utiliser le min-height sur ta div1 pour te garantir une certaine hauteur ... mais ça marche que sous moz
Néanmoins il existe un moyen de ruser pour IE:
Code :
|
Marsh Posté le 18-09-2003 à 12:42:49
Anapajari a écrit : tu peux utiliser le min-height sur ta div1 pour te garantir une certaine hauteur ... mais ça marche que sous moz
|
Non, évidemment, pas de JS pour des problèmes de mise en page, ça va de soi... Evidemment, avec du JS tout est possible, mais ça ne m'intéresse pas...
Mais merci quand même d'avoir participé.
(Et d'ailleurs, en y repensant, même la solution du min-height pour Moz ne marchera pas... En effet, il faut que le div 1 s'adapte en fonction de la place QUI RESTE sur la page - Il n'est pas possible de déterminer de quelle hauteur il aura besoin à l'avance sans JS).
Marsh Posté le 18-09-2003 à 13:00:28
Et en se servant de ça ?
http://www.v2studio.com/k/lab/fixed/index2.html
Marsh Posté le 18-09-2003 à 13:02:37
Bin si:
Code :
|
ça marche bien ... enfin sous mozilla hein
Mais du coup ça m'a donné une idée en faisant comme ça:
Dans la div du haut( avec height a auto) tu mets une autre div de largeur 0% et de hauteur le minimum que tu veux pour ta div centrale. Si bien qui si il y a trop peu de contenu dans la div du haut elle aura quand meme la bonne hauteur a cause de la div de largeur 0. Non?
Marsh Posté le 18-09-2003 à 13:09:47
Hermes, il me semble que c'est possible, mais tu va me dire ce que tu en penses.
En fait dans le premier bout de code que tu nous à montré, le cadre global contient le texte et le pied de page.
Mais il me semble que si tu mets le texte dans un div, cela marchera mieux.
- div avec texte : position abolute top:0
- div pied : position absolute et bottom:0
c'est comme ca que j'aurais procédé
Marsh Posté le 18-09-2003 à 13:11:36
flyman30 a écrit : Et en se servant de ça ? |
Non.
1) ya bug avec Opera (dbl scroll).
2) ça ne concerne qu'un div qui reste en haut, et ça j'ai aucun problème pour le faire (et bien mieux même...).
Marsh Posté le 18-09-2003 à 13:13:17
Anapajari a écrit : Bin si:
|
Non passe pas avec IE et de plus scroll sous Moz...
Marsh Posté le 18-09-2003 à 13:14:23
Lord II a écrit : Hermes, il me semble que c'est possible, mais tu va me dire ce que tu en penses. |
Fais un test et poste le ici. Ce que tu proposes est la première chose que j'ai essayé. Le problème, c'est qu'un div en absolute ne poussera jamais un autre div. Donc à priori non, sauf si tu parviens à me montrer le contraire...
Marsh Posté le 18-09-2003 à 13:20:37
Hermes le Messager a écrit : |
Effectivement, cela ne fonctionne qu'avec une hauteur du cadre global fixée ( suffisamment grande en plus ),
mais je n'ai pas dis mon dernier mot
Marsh Posté le 18-09-2003 à 13:22:38
Lord II a écrit : |
Aller pour le cas des divs scrollables : http://forum.hardware.fr/forum2.ph [...] h=&subcat=
je double la prime offerte : 20?
Marsh Posté le 18-09-2003 à 14:48:06
ChiCOToS a écrit : |
Oui, sauf que je veux qu'en plus, quoi qu'il arrive le fixe reste en bas de l'écran... (et évidemment, si le contenu déborde de l'écran, je veux que ce contenu "pousse" le fixe...)
Marsh Posté le 18-09-2003 à 14:49:29
<?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html;charset=iso-8859-1">
<title>test</title>
<style>
body,html{
margin:0;
}
#div1{
background-color:green;
width:100%;
/* pour IE 5 */
height:100%;
padding-bottom:60px;
padding-top:60px;
/* pour moz */
height/**/:auto;
position/**/:absolute;
top/**/:0px;
bottom/**/:0px;
}
#div2{
background-color:red;
/* pour IE 5 */
overflow:auto;
height:100%;
/* pour moz */
}
</style>
</head><body>
<div id="div1">
<div id="div2">
asdfasdf<br />
asdfasdf<br />
asdfasdf<br />
asdfasdf<br />
asdfasdf<br />
asdfasdf<br />
asdfasdf<br />
asdfasdf<br />
asdfasdf<br />
asdfasdf<br />
asdfasdf<br />
asdfasdf<br />
asdfasdf<br />
asdfasdf<br />
asdfasdf<br />
asdfasdf<br />
</div>
</div>
</body>
</html>
Marche avec Moz et IE5
Chez moi ça fait planter Opera7
Marche pas avec Opera6
Marsh Posté le 18-09-2003 à 14:54:50
ça ne marche qu'avec Mozilla chez moi. Ni IE, ni Opera...
Marsh Posté le 18-09-2003 à 14:55:56
ReplyMarsh Posté le 18-09-2003 à 14:57:15
fadenreturns a écrit : C pasque tu utilise IE6 |
Ben oui...
Je vais aller tester ta page avec IE 5.5... attends un peu...
Marsh Posté le 18-09-2003 à 14:58:54
Des fois faut savoir se limiter à ce que les navigateurs gère bien.
En plus je suis pas sûre que ça soit utile de proposer deux endroit ou l'information est persistante. Une seule suffit largement. Je dirais même que c'est déjà trop.
Mais si on veut vraiment que ça marche partout. Bha il reste toujours les Hack CSS. Mais faut avoir tout les navigateurs sous la main.
http://www.magnin-sante.ch/journal/index.php/CSSHacks
Marsh Posté le 18-09-2003 à 14:59:12
Même problème que pour IE 6... Le div du bas ne reste pas en bas si la page est trop grande...
Marsh Posté le 18-09-2003 à 15:00:25
ça va pas marcher ave IE5.5
faut voir le lien qui est en haut pour comprendre.
Marsh Posté le 18-09-2003 à 15:01:26
j'ai pas IE6 et ie 5.5 sous la main donc je peux rien faire.
Marsh Posté le 18-09-2003 à 15:03:09
fadenreturns a écrit : Des fois faut savoir se limiter à ce que les navigateurs gère bien. |
Oui, à condition qu'il n'y ai aucune solution. Hors moi, j'ai une solution qui fonctionne parfaitement avec les tables en XHTML 1.1 .
Doit-on limiter les possibilités sous prétexte que c'est pas "philosophiquement" compliant ? Je ne crois pas. Les normes ne sont pas faites pour limiter la créativité, mais pour l'étendre.
Citation : En plus je suis pas sûre que ça soit utile de proposer deux endroit ou l'information est persistante. Une seule suffit largement. Je dirais même que c'est déjà trop. |
Bien sûr que si, ça peut être utile. Et puis, c'est le client qui décide de toutes manières. Le problème n'est pas là.
Encore une fois, je ne VEUX PAS m'interdire de réaliser quelque chose de réalisable. Les divs et les normes doivent étendre les possibilités, pas les limiter.
Citation : Mais si on veut vraiment que ça marche partout. Bha il reste toujours les Hack CSS. Mais faut avoir tout les navigateurs sous la main. |
Non, c'est une mauvaise solution, car elle ne tient pas compte de l'évolution des browsers, et dès qu'on passe à une nouvelle version, ça ne marchera plus.
Marsh Posté le 18-09-2003 à 15:08:50
Hermes le Messager a écrit :
|
Tu n'as qu'à t'inscrire au commité de normalisation psi tu veux. Moi je pense que oui il faut se débarasser de l'usage de TABLE pour la mise en page. Ce n'est pas à ça que ça sert.
PS : il se comporte comment à l'impression ton truc qui reste en bas ?
Marsh Posté le 18-09-2003 à 15:11:44
Kristoph a écrit : |
Mais parfaitement. Dès qu'il y a une autre solution, je suis parfaitement d'accord. Mais l'extrémisme "bête et stupide" qui consiste à dire : pas de table, même si certaines choses utiles sont irréalisables sans, non je ne suis pas d'accord.
Citation : PS : il se comporte comment à l'impression ton truc qui reste en bas ? |
Très bien. Aucun problème de ce côté justement.
De toutes manières, j'emploie une autre feuille de style spéciale pour l'impression.
Marsh Posté le 18-09-2003 à 15:17:06
groumpf
A par l'ascenseur qui disparait, j'ai un truc qui marche pour IE6/Moz/Op7
Marsh Posté le 18-09-2003 à 15:23:29
gizmo a écrit : groumpf |
Montre
Marsh Posté le 18-09-2003 à 15:33:58
Très beau, j'avais eu un truc équivalent il y a quelques semaines, avec le même problème de l'ascenseur. Mais moi, la situation se rétablissait quand on rezisait la fenêtre...
Marsh Posté le 18-09-2003 à 15:35:22
Et sinon, ta version *IE only* que tu as retiré, on peut la revoir? parce que la solution doit surement être un mix des deux.
Marsh Posté le 18-09-2003 à 15:38:06
La voilà : (Mais elle implique une organisation radicalement différente de la page).
Code :
|
Marsh Posté le 18-09-2003 à 15:40:09
ouais, ca c'est pas grave. ce qui est chiant, c'est qu'elle implique SURTOUT l'utilisation du mode draft, ce qui empèche l'utilisation de nombreuses autres choses.
Marsh Posté le 18-09-2003 à 15:42:27
gizmo a écrit : ouais, ca c'est pas grave. ce qui est chiant, c'est qu'elle implique SURTOUT l'utilisation du mode draft, ce qui empèche l'utilisation de nombreuses autres choses. |
C'est pour cela que pour le moment, ma solution avec juste une table est la meilleure, parce qu'il y a auto-resize de la cellule centrale du fait justement que c'est un tableau en 100% et qu'on fixe la taille du haut et du bas.
Ma démarche reste quand même la plus logique, même si je reconnais que ce n'est pas satisfaisant du point de vue "idéologique".
Marsh Posté le 18-09-2003 à 15:48:37
C'est le topic d'à côté ce défi là
(faut dire que le défi de ce topic ça me semble pas vraiment possible un position:fixed "sauf des fois", c'est pas gagné à mon avis)
Marsh Posté le 18-09-2003 à 15:49:35
Hermes le Messager a écrit :
|
Marsh Posté le 18-09-2003 à 15:49:49
fastclemmy a écrit : |
Belle expo. du problème.
Marsh Posté le 18-09-2003 à 16:01:10
fadenreturns a écrit : |
Mais on est d'accord, rassures-toi. Là, je parle de circonstances exceptionnelles.
Citation : Les normes sont là pour garantir une plus grande diversité. Mais pas uniquement dans le sens où tu l'entend. Diversité c'est aussi une diversités des logiciels et des personnes et non uniquement une diversité des "design". Les tables vont à l'encontre de cette diversité quand elle sont utilisée dans un but présentationelle. |
Toujours d'accord, mais attention à une chose. Une table en 3 parties organisée verticalement comme dans la problèmatique ne constituera pas d'obstacle à la lisibilité du site, même en mode texte. C'est surtout la prolifération de table dans un design qui entraine ce dont tu parles.
Citation : En bref les normes ça sert à quelques chose ... |
J'ai dit le contraire ?
Citation : Mais in doit être possible des faire des sites en tables qui sont pas trop pourri. ça dépend de comment tu le fait. |
Il ne s'agit pas de faire des sites "en table", mais de ne pas devenir aussi bête que les gens qui disent : faisons des sites seulement pour IE et tant pis pour les autres.
Il faut savoir "raison garder" quand la meilleure solution à un problème donné est une table.
Citation : Par contre pour le référencement cest plus coton. Les clients son plus sensibles à cet arguments. |
D'accord aussi, mais là, dans le cas qui nous occupe, il n'y a aucun problème avec le référencement. Ce serait une organisation avec une Iframe ou des frames qui poseraient un problème.
Citation : Je vois pas comment tu peux garantir le fonctionnement de ton truc ... |
Ben on ne peut jamais rien garantir. Mais les tables existeront toujours ainsi que la possibilité de les dimensionner. Par contre, un hack pour une version d'un nav, j'en suis moins convaincu. Et puis de toutes manières, on retombe dans le "sémantiquement incorrect" et même sans doute le "syntaxiquement incorrect" (il faudrait vérifier avec le validateur).
Marsh Posté le 18-09-2003 à 11:48:55
Voilà le plan :
-------------------------------------
- -
- -
- -
- -
- -
- partie variable en hauteur 1 -
- -
- -
- -
- -
-------------------------------------
- partie fixe en bas 2 -
-------------------------------------
La problèmatique est la suivante :
- Je sais mettre deux div l'un au dessus de l'autre, et si la partie 1 est PLUS IMPORTANTE que l'écran, aucun problème, la partie 1 pousse la partie 2, et la partie 2 est bien en bas.
- Je sais également faire en sorte de "fixer" la partie 2 en bas en absolute.
MAIS : Je ne sais pas faire les deux en même temps.
Je m'explique :
- Si la partie 2 est en absolute, la partie 1 ne pousse plus sur celle-ci, ce qui fait que si le contenu de la partie 1 déborde, c'est la cata.
- Si la partie 2 est en relative, elle se "colle" au dessous de la partie 1, mais si le contenu de la partie 1 est trop faible, la partie 2 n'est plus collé en bas.
Ma question :
A part l'utilisation d'un tableau, existe-t-il une solution crossbrowser (IE 5+, Moz 1+, Opera 7+) ?