28216 sujets

CSS et mise en forme, CSS3

Bonsoir tout le monde !

Je voux explique mon problème qui me casse les pieds, j'ai mon site :

http://www.planet-lec.com/ sur la page d'accueil pas problème avec la terre en opacité sur le fond blanc crême car il n'y a pas beaucoup de contenu sur la page d'accueil (c'est un background:url(../images/milieu.jpg) repeat-y) et le paysage change correctement avec les animations en 1er plan.

Là ou ça pose problème et du coup c'est moins joli c'est ici : http://www.planet-lec.com/search.php car l'affichage des produits se fait sans problème, la terre se répète également sans problème mais en bas de page elle est coupée en 2 car mon div répète l'image jusque bout du contenu mais pas de l'image ! d'où ma question est ce que c'est possible que le div en question lorsque son contenu est terminé, termine répète également le background jusqu'au bout ?

Voilà j'espère que vous avez réussi à me comprendre Smiley smile

Si vous voulez que je vous copie le code pas de problème.

merci de votre aide Smiley smile

JJ
Bonjour,
Avec une résolution verticale supérieure à 800px je rencontre également le problème décrit sur la page d'accueil de votre site.

a écrit :
la terre se répète également sans problème mais en bas de page elle est coupée en 2 car mon div répète l'image jusque bout du contenu mais pas de l'image ! d'où ma question est ce que c'est possible que le div en question lorsque son contenu est terminé, termine répète également le background jusqu'au bout ?

Le fait qu'elle soit coupée est un comportement normal. L'éternelle distinction entre la mise en forme et le contenu, en somme ; votre image est déclarée dans le style du div, vous le dites vous-même ("background:url ..") or par défaut la hauteur dudit bloc est adaptée à son contenu, en l'occurrence la liste de vos produits pour la deuxième page. Votre Terre aurait été prise en compte de la même manière (dans son entier, sans être tronquée) si elle faisait partie de ce contenu (dans le code, img src ..)

Pour d'éventuelles solutions (sans gros chambardement de structure), je laisse les personnes plus calées que moi vous éclairer. (parce que le système D ... Smiley biggol )
Bonne chance !
Modifié par Singularity (05 Feb 2009 - 00:35)
tu as mis une autre image en dessous de cette terre, donc si tu affiche la terre jusqu'au bout, ça va cacher l'autre image (le flash)
Salut Smiley smile

Merci quand même de ta réponse ! en espérant que quelqu'un une solution car là je sèche j'ai fais pas mal de recherches mais je n'ai rien trouvé Smiley smile
madri2 a écrit :
tu as mis une autre image en dessous de cette terre, donc si tu affiche la terre jusqu'au bout, ça va cacher l'autre image (le flash)


hmmmmm en fait j'aimerais que mon image du milieu (la terre) ne soit pas coupée mais qu'elle s'affiche toujours à 100% et pas en morceaux ? sinon j'ai la solution d'enlever la terre de l'image du milieu mais ce serait dommage...
Bonjour,

Mmmh... A ta place je commencerais par (re?)lire les tutoriels d'Alsacreations concernant la mise en page et le balisage XHTML (ton site a même pas de doctype Smiley decu ).

Sinon une idée pour ton problème : caler une image en bas de ton conteneur (positionnement absolu) avec un fondu couleur de fond / transparence pour "adoucir" la coupure du background.

On ne peut pas avec les technologies actuelles (XHTML / CSS) faire les choses comme tu le voudrais (étirer proportionnellement un conteneur). Ou alors il faudra passer par du Javascript...
BeliG a écrit :
Bonjour,

Mmmh... A ta place je commencerais par (re?)lire les tutoriels d'Alsacreations concernant la mise en page et le balisage XHTML (ton site a même pas de doctype Smiley decu ).

Sinon une idée pour ton problème : caler une image en bas de ton conteneur (positionnement absolu) avec un fondu couleur de fond / transparence pour "adoucir" la coupure du background.

On ne peut pas avec les technologies actuelles (XHTML / CSS) faire les choses comme tu le voudrais (étirer proportionnellement un conteneur). Ou alors il faudra passer par du Javascript...


Salut Smiley cligne

Oui pour l'instant mon site n'a pas de doctype car c'est encore une maquette et ensuite dès que je mets un doctype j'ai un soucis d'espace entre le bandeau du haut et le contenu (ce sera ma prochaine question je me suis bien cassé la tête là dessus Smiley cligne Et à part l'attribut <marquee> et quelques détails qu'il me reste à régler pour l'affichage des produits le site est compatible XHTML 1.0

Effectivement je pourrais peut être tester avec une image en png entre le flash du bas et le contenu je vais faire un test pour voir Smiley cligne merci Smiley cligne

Si quelqu'un a d'autres idées je suis preneur Smiley smile
Je pense que tu as développé ton site à l'envers du coup.

Le doctype est un élément essentiel qui va déterminer (entre autre) le mode de rendu à utiliser par le navigateur (IE6/7 se lachant un peu (beaucoup) quand le doctype est absent ou mal écrit).

Il est primordial que le doctype soit le premier élement que tu inclue dans une page HTML, sans ça, comme tu le contaste, tu aura beaucoup plus de travail "d'adaptation" à faire par la suite.

Pour ce qui est du background, ce n'est pas possible de faire en sorte qu'il se répète en entier. Une solution JS serait envisageable, mais lourde et n'apporterait pas grand chose.
Laurie-Anne a écrit :
Je pense que tu as développé ton site à l'envers du coup.

Le doctype est un élément essentiel qui va déterminer (entre autre) le mode de rendu à utiliser par le navigateur (IE6/7 se lachant un peu (beaucoup) quand le doctype est absent ou mal écrit).

Il est primordial que le doctype soit le premier élement que tu inclue dans une page HTML, sans ça, comme tu le contaste, tu aura beaucoup plus de travail "d'adaptation" à faire par la suite.

Pour ce qui est du background, ce n'est pas possible de faire en sorte qu'il se répète en entier. Une solution JS serait envisageable, mais lourde et n'apporterait pas grand chose.


Ok merci de l'info Smiley smile

Je penche qu'en attendant je vais passé comme le disait plus haut Belig un png avec transparence progressive pour adoucir la coupure....

En fait je viens de remettre en ligne un doctype et je n'ai plus le problème que j'avais avant Smiley smile