Calques dans objets de mise en page CSS

Goliath

Membre expert
Club iGen
3 Juillet 2002
1 997
25
Hello la tribu! :coucou:

...là je donne ma langue au chat. Dans Golive CS2 il est possible d'effectuer des mises en page liquides grâce aux objets de mise en page CSS.
Ma question est la suivante: comment insérer un calque dans une de ces fenêtres liquides?
A chaque fois que je fais un glisser-déposer du calque à insérer, il ne se met pas en place comme il devrait. En effet au moment de redimensionner ma fenêtre, le calque reste immobile tandis que les autres éléments sont bien "fluides"....une idée?

:zen:
 
Hello la tribu! :coucou:

...là je donne ma langue au chat. Dans Golive CS2 il est possible d'effectuer des mises en page liquides grâce aux objets de mise en page CSS.
Ma question est la suivante: comment insérer un calque dans une de ces fenêtres liquides?
A chaque fois que je fais un glisser-déposer du calque à insérer, il ne se met pas en place comme il devrait. En effet au moment de redimensionner ma fenêtre, le calque reste immobile tandis que les autres éléments sont bien "fluides"....une idée?

:zen:
je pense que ton calque est positionné (et/ou dimmensionné) avec des valeurs fixe, positionne (et/ou dimensionne) le avec des pourcentages :)
 
je pense que ton calque est positionné (et/ou dimmensionné) avec des valeurs fixe, positionne (et/ou dimensionne) le avec des pourcentages :)

...nada :( ... je comprends vraiment pas comment y arriver. Le plus simple sera de mettre le fichier en ligne. C'est un exemple des pages en CSS de Golive.
Apparemment le menu de navigation est sur un calque qui lui même est ancré (je ne sais pas comment :rolleyes: ) sur la colonne de droite d'un objet CSS...

:zen:
 
...nada :( ... je comprends vraiment pas comment y arriver. Le plus simple sera de mettre le fichier en ligne. C'est un exemple des pages en CSS de Golive.
Apparemment le menu de navigation est sur un calque qui lui même est ancré (je ne sais pas comment :rolleyes: ) sur la colonne de droite d'un objet CSS...

:zen:
Et c'est quoi que tu veux exactement ?? que le menu de navigation fasse quoi, parce je viens de tester la page en local en redimensionnant la fenêtre exagérément dans tout les sens et rien ne m'a gêné.
 
Et c'est quoi que tu veux exactement ?? que le menu de navigation fasse quoi, parce je viens de tester la page en local en redimensionnant la fenêtre exagérément dans tout les sens et rien ne m'a gêné.

...tout simplement je voudrais arriver à faire la même chose dans un autre doc html en plaçant des calques dans des objets CSS déplaçables (fluides)... je n'arrive pas à intégrer le calque dans l'objet CSS afin qu'il soit lui aussi fluide...
Le fichier clothingcompany.zip que j'ai envoyé est un modèle qui se trouve dans GoLive, ce n'est pas moi qui l'ai fait...
 
...tout simplement je voudrais arriver à faire la même chose dans un autre doc html en plaçant des calques dans des objets CSS déplaçables (fluides)... je n'arrive pas à intégrer le calque dans l'objet CSS afin qu'il soit lui aussi fluide...
Le fichier clothingcompany.zip que j'ai envoyé est un modèle qui se trouve dans GoLive, ce n'est pas moi qui l'ai fait...
ça j'avais compris, ce que je voulais c'est que tu me dise en quoi il n'est pas fluide et surtout les id si possible de ces objet parce que le code source est assez bordélique.

Je pense que tu parles du div id="menu" et je ne vois pas en quoi il n'est pas "fluide" : il se déplace bien avec le reste quand on redimensionne la fenêtre.
 
ça j'avais compris, ce que je voulais c'est que tu me dise en quoi il n'est pas fluide et surtout les id si possible de ces objet parce que le code source est assez bordélique.

Je pense que tu parles du div id="menu" et je ne vois pas en quoi il n'est pas "fluide" : il se déplace bien avec le reste quand on redimensionne la fenêtre.

...bon, je vais vite t'envoyer un tout bête exemple pour mieux comprendre...
 
Je vais essayer de télécharger la démo de GoLive pour voir ce que tu veux dire… Je reviens…
 
...voilà, c'est juste une image dans un calque qui lui se trouve dans un objet déplaçable CSS --> Deux colonnes: fixe, à gauche... Le calque ne suit plus le redimensionnement de la fenêtre...
...c'est clair qu'avec GoLive sous la main mon problème sera plus facile à comprendre...

:zen:

...là je dois sortir, je serai de retour plus tard...merci!
 
...voilà, c'est juste une image dans un calque qui lui se trouve dans un objet déplaçable CSS --> Deux colonnes: fixe, à gauche... Le calque ne suit plus le redimensionnement de la fenêtre...
...c'est clair qu'avec GoLive sous la main mon problème sera plus facile à comprendre...

:zen:

...là je dois sortir, je serai de retour plus tard...merci!
sur ce deuxième exemple je vois bien que ça ne bouge pas, mais sur le premier, je maintient que chez moi (firefox et safari) ça marche comme tu le demande...


Et dans ce deuxième exemple c'ets bien ce que je t'avais dis dans mon premier post : la valeur de position et absolute (en css) et en plus la position est donné en pixel : donc normal que ça ne bouge pas... :rolleyes:


Si tu veux un design fluide il faut positionner ce pull avec des valeur en pourcentage...

ligne 14 du fichier index.html :
Bloc de code:
#pull { height: 270px; width: 230px; margin-left: 20%; top: 0; visibility: visible; }
avec ça ça marche, (sauf que c'est peut-être pas 20% que tu veux, mais ça tu peux changer).
 
  • J’aime
Réactions: Goliath
Bon. J'ai fait un petit screencast (21 Mo). J'ai un peu merdé sur la fin* pour le petit pavé à droite mais bon je pense que tu devrais te débrouiller avec ça. ;)

J'ai pas trouvé comment intégrer tout ses réglages CSS dans une feuille externe par contre sauf en exportant les styles. Pas clair. Enfin bon.

Mais je te conseille GRANDEMENT de suivre ce tutoriel pour débutant, on ne débute pas dans la mise en page web comme ça sans avoir les notions de base. De même qu'on ne fait pas la mise en page papier sans savoir ce qu'est un cadratin, le corps, l'œil ou les règles typographiques. ;)





*Mais je ne le recommencerai pas. Vive les éditeurs de texte. :p
 
sur ce deuxième exemple je vois bien que ça ne bouge pas, mais sur le premier, je maintient que chez moi (firefox et safari) ça marche comme tu le demande...


Et dans ce deuxième exemple c'ets bien ce que je t'avais dis dans mon premier post : la valeur de position et absolute (en css) et en plus la position est donné en pixel : donc normal que ça ne bouge pas... :rolleyes:


Si tu veux un design fluide il faut positionner ce pull avec des valeur en pourcentage...

ligne 14 du fichier index.html :
Bloc de code:
#pull { height: 270px; width: 230px; margin-left: 20%; top: 0; visibility: visible; }
avec ça ça marche, (sauf que c'est peut-être pas 20% que tu veux, mais ça tu peux changer).

...okidok, ça marche à la perfection! ...maintenant j'ai compris!... merci! ;) :up:
 
Bon. J'ai fait un petit screencast (21 Mo). J'ai un peu merdé sur la fin* pour le petit pavé à droite mais bon je pense que tu devrais te débrouiller avec ça. ;)

J'ai pas trouvé comment intégrer tout ses réglages CSS dans une feuille externe par contre sauf en exportant les styles. Pas clair. Enfin bon.

Mais je te conseille GRANDEMENT de suivre ce tutoriel pour débutant, on ne débute pas dans la mise en page web comme ça sans avoir les notions de base. De même qu'on ne fait pas la mise en page papier sans savoir ce qu'est un cadratin, le corps, l'œil ou les règles typographiques. ;)

*Mais je ne le recommencerai pas. Vive les éditeurs de texte. :p

...heu...je sais parfaitement ce que c'est un cadratin, le corps, l'œil ou les règles typographiques... je viens de ce monde là!!! L'exemple que j'ai mis en ligne était juste pour comprendre comment on intègre un calque dans un objet CSS déplaçable...
 
...heu...je sais parfaitement ce que c'est un cadratin, le corps, l'œil ou les règles typographiques... je viens de ce monde là!!! L'exemple que j'ai mis en ligne était juste pour comprendre comment on intègre un calque dans un objet CSS déplaçable...

Ben je sais bien que tu sais, je faisais l'analogie entre les bases du web et les bases de la mise en page. ;) :D

La vidéo, je l'enlève ou je la laisse?
 
Bon. J'ai fait un petit screencast (21 Mo). J'ai un peu merdé sur la fin* pour le petit pavé à droite mais bon je pense que tu devrais te débrouiller avec ça. ;)

J'ai pas trouvé comment intégrer tout ses réglages CSS dans une feuille externe par contre sauf en exportant les styles. Pas clair. Enfin bon.

Mais je te conseille GRANDEMENT de suivre ce tutoriel pour débutant, on ne débute pas dans la mise en page web comme ça sans avoir les notions de base. De même qu'on ne fait pas la mise en page papier sans savoir ce qu'est un cadratin, le corps, l'œil ou les règles typographiques. ;)





*Mais je ne le recommencerai pas. Vive les éditeurs de texte. :p
Wouaw bravo pour lescreencast, par contre ça donne pas envie de lacher son éditeur de texte, ça va plusse vite à la mano :)


Hand coded website rulez

:zen:
 
Ben je sais bien que tu sais, je faisais l'analogie entre les bases du web et les bases de la mise en page. ;) :D

La vidéo, je l'enlève ou je la laisse?

...tu peux l'enlever, merci... je ne pense pas de toute façon que t'as bien lu mon post. Je demendais comment intègrer des calques DANS des objets CSS déplaçables (fluides)... ;)
 
Wouaw bravo pour lescreencast, par contre ça donne pas envie de lacher son éditeur de texte, ça va plusse vite à la mano :)


Hand coded website rulez

:zen:

...ça dépend pour qui.. ;)
 
...tu peux l'enlever, merci... je ne pense pas de toute façon que t'as bien lu mon post. Je demendais comment intègrer des calques DANS des objets CSS déplaçables (fluides)... ;)

Oui, j'étais pas trop sûr de ce que tu voulais exactement alors j'ai fait ce screencast qui reprend les bases. Je vais effacer le fichier, désolé, mais il est un peu indiscret. ;)
 
Oui, j'étais pas trop sûr de ce que tu voulais exactement alors j'ai fait ce screencast qui reprend les bases. Je vais effacer le fichier, désolé, mais il est un peu indiscret. ;)

...je suppose que tu l'as fait avec SnapzPro?
 
Oui, tout frais installé, encore bon pendant 30 jours. :) Le premier fichier faisait plus de 400 Mo :sick: tout ça parce que j'avais laissé la vidéo en «256 couleurs windows» par défaut. :siffle: