[résolu] buy_block et short_description_block déplacés à droite

[funnytoy]

Bonjour,

Pour l'instant dans ma page produit, la photo, la descritpion, le buy_block sont tous alignées les uns en dessous des autres à gauche de ma colonne centrale.

j'aimerais pourvoir migrer le short_descritpion_block et le buy_block à droite de la photo (voir photo jointe).

Je suppose que pour cela je dois modifier le product.tpl mais quelles lignes exactement?

Merci pour votre aide précieuse.

[funnytoy]

Je viens de me rendre compte que je n'ai pas posté mon message dans le bon forum, sorry, je le reposte donc ici. :red:

Bonjour,

Pour l’instant dans ma page produit, la photo, la descritpion, le buy_block sont tous alignées les uns en dessous des autres à gauche de ma colonne centrale.

j’aimerais pourvoir migrer le short_descritpion_block et le buy_block à droite de la photo (voir photo jointe).

Je suppose que pour cela je dois modifier le product.tpl mais quelles lignes exactement?

Merci pour votre aide précieuse.

[Peha]

Bonjour
il faut savoir que c'est le contenu (le texte, les images produits) qui est géré par les tpl
sa mise en forme (l'habillage graphique) est gérée par les css

cf http://www.csszengarden.com/tr/francais/
-> le même code html, seul les css changent lorsqu'on clique sur les liens à droite.

Pour ce que tu veux faire c'est donc dans global.css que se trouve ta solution.
Je te conseille d'utiliser FIREBUG pour tester rapidement différentes modifications en live
Si tu ne connais pas grand chose au css, fais un tour sur http://www.alsacreations.com/tutoriels/ pour apprendre les bonnes pratiques de l'intégration html. (avoir un code valide et accessible est important)

pour ton problème, je pense qu'il faut que tu applique à l'image du produit un float:right;
ce qui aura pour effet de remonter les blocs suivants (dans la mesure ou leur width n'est pas trop grand. Auquel cas il faudra le réduire)

note : c'est du CSS 2. Le CSS 3 n'est pas encore interpretable par tt le monde.

[funnytoy]

Merci pour ta réponse rapide,

J'ai utilisé Firebug pour localiser le style dans global.css et j'ai donc ajouter le float right comme tu le suggères.

J'ai donc:

#primary_block #image-block img {
border:1px solid #D0D1D5;
float:right;
}

Ceci ne donne absolument pas un résultat concluant, car mon image se positionne maintenant pratiquement complètement sur la colonne de gauche.

Désolée, mais cela ne semble pas être la solution...

[jolvil]

Topics fusionnés - Merci de ne pas multiplier les discussions sur le meme sujet.


Votre probleme et sans doute un probleme de largeur, les blocs sont normalement à droite, si il n'y a pas la largeur sufisante pour l'affichage alors ils glissent dessous.

[Atch]

Merci pour ta réponse rapide,

J'ai utilisé Firebug pour localiser le style dans global.css et j'ai donc ajouter le float right comme tu le suggères.

J'ai donc:

#primary_block #image-block img {
border:1px solid #D0D1D5;
float:right;
}

Ceci ne donne absolument pas un résultat concluant, car mon image se positionne maintenant pratiquement complètement sur la colonne de gauche.

Désolée, mais cela ne semble pas être la solution...

Le hic c'est que ta description et le block prix est trop large pour rentrer dans le peu de place que tu as laissé dans ton template personnalisé..

essaie de rentrer une Mercedes 500 sl dans une place réservée à une twingo!! tu vois le drame et bien là c'est pareil.

Soit tu fais plus de place pour la mercedes, ou soit tu prends une twingo. Mais tout cela se passe dans le garage global.CSS, demande le mécano firebug de ma part, il va te dépanner et te dire où réduire la largeur de ta Mercedes

V++

Atch

[funnytoy]

Grand merci de m'avoir mise sur la voie. Je suis modeste, j'ai opté pour la Twingo.
j'ai donc redimensionné mon image à 200 px dans le BO Préférences-images pour mon image large.
J'ai ensuite recherché grâce à Firebug les différents blocs concernés qui seraient à redimensionner dans global.css, leur ai donné la largeur voulue.
Résultat: PARFAIT!!! Juste le look que je désirais :-)

Encore merci et certainement à une prochaine fois...

[Peha]

dans les règles de l'art
pense à vérifier que l'affichage est identique selon les navigateurs.

et si ton pb est résolu, met [résolu] dans le titre de ton premier message.

pa.