Discussion :

[NewUserDelphi]

Bonjour

Apres avoir longuement réfléchis au design de mon site je bute sur un problème de 'repositionnement' de div.



Je souhaite sur écran large deux div juxtaposées ( à gauche du texte et à droite une image) et que si l écran est plus petit, que la div de droite contenant l image s'affiche au dessus de l'autre (pas superposées mais 'sur deux lignes').

J y parviens en trichant, c est à dire en affichant 3 divs, 1 image 100% largeur qui ne s affiche que sur les petits écrans, 1 texte toujours visible (100% sur les petits écrans 50% sur les grands) et une autre div image (50% de large) qui ne s affiche que sur les grands Ecrans mais je me dis qu il y a peut être plus 'propre'.

J utilise actuellement cette grille mais https://blueprintcss.dev/ mais si vous en connaissez une qui réponde à mes besoins je suis preneur...

merci pour votre aide

[DMC]

Bonjour NewUserDelphi,

Je pense que cela est faisable avec blueprintcss.dev

Regarde
Responsive Columns : https://blueprintcss.dev/docs/grid
Columns Ordering : https://blueprintcss.dev/docs/column-ordering

Cela doit donner un truc comme cela, je pense :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
 <div bp="grid">
  <div bp="1 2@sm last first@sm">Text</div>
  <div bp="1 2@sm">Imag</div>
</div>

[NewUserDelphi]

merci pour ta réponse c est exactement cela. Je n avais pas pensé à lire cette partie de la doc