IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

Mise en page CSS Discussion :

Utilisation Grid ou Flex ?


Sujet :

Grille CSS (CSS Grid)

Vue hybride

Message précédent Message précédent   Message suivant Message suivant
  1. #1
    Membre confirmé
    Homme Profil pro
    Consultant informatique
    Inscrit en
    Août 2019
    Messages
    51
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 46
    Localisation : Belgique

    Informations professionnelles :
    Activité : Consultant informatique
    Secteur : Finance

    Informations forums :
    Inscription : Août 2019
    Messages : 51
    Par défaut Utilisation Grid ou Flex ?
    Bonjour à tous,

    en fait, j'ai déjà commencé le site mais, en cours de route, je me suis rendu compte que j'aurais mieux fait d'utiliser les Grids ou les Flex pour la conception du site.

    En fait, le header et le menu (à gauche) fonctionne parfaitement pour l'instant pour la version smartphone et laptop. Par contre, dans le corps du site, je dois faire pas mal d'adaptations et, après avoir lu pas mal de choses sur le CSS, je me suis rendu compte que c'était préférable d'utiliser soit les Grids et/ou les Flex pour la mise en page.

    Je suppose que c'est préférable que je recommence la mise en page du site depuis le début afin d'appliquer les Grids et/ou Flex à tout le site. Je suppose que ce ne sera pas trop propre d'adapter uniquement les Grids et/ou Flex uniquement au corps du site ?

    Afin d'utiliser les Grids et/ou Flex, avez-vous des recommandations à me faire ? Où puis-je trouver des informations sur les Grids et/ou Flex responsive ?

    Doit-on utiliser uniquement les Grids ou uniquement les Flex ou peut-on les combiner ? Si on peut les combiner, quel est l'avantage de cette association ?

    Merci d'avance

    Bonne journée
    Thierry

  2. #2
    Invité
    Invité(e)
    Par défaut
    Bonjour,

    tu devrais faire des recherches, approfondir tes connaissances, et te faire ta propre opinion et expérience.
    Il n'y a pas ici de "mieux" ou "moins bien" ou "pas en même temps".
    Il faut juste utiliser ce qui est nécessaire à bon escient.

    grid ou flexbox ?
    Parfois un simple display:table/table-cell; fait parfaitement la farce.

    Il faut aussi penser "responsive" et "mobile first".


    Tu peux aussi te tourner vers Bootstrap (ou équivalent).

    NE PA OUBLIER :
    "Un BON code est un code SIMPLE."

  3. #3
    Membre confirmé
    Homme Profil pro
    Consultant informatique
    Inscrit en
    Août 2019
    Messages
    51
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 46
    Localisation : Belgique

    Informations professionnelles :
    Activité : Consultant informatique
    Secteur : Finance

    Informations forums :
    Inscription : Août 2019
    Messages : 51
    Par défaut
    Bonjour Jérôme,

    encore une fois, merci pour vos conseils, votre aide et votre documentation.

    En effet, comme vous le dites, il faut que la solution soit responsive. De mon côté, je n'ai pas trop envie de dépendre de Bootstrap. Donc, je préfère essayer d'écrire mon propre CSS mais ça risque de me prendre du temps mais c'est peut-être la meilleure solution pour apprendre. -

    Par contre, je me demande si je peux facilement diviser une partie de la page avec les grids tout en essayant d'implémenter une solution responsive. En fait, j'ai mon header qui occupe tout le haut sur une certaine hauteur fixe, puis j'ai une side bar à gauche qui est le menu et qui est fixe sur laptop mais qui vient apparaître à l'écran quand on clique sur l'hamburger pour la version smartphone. A côté de cette side bar (menu) pour la version laptop, j'ai le corps que j'aimerais bien mettre en page par ce système de grilles entre autre. Le menu est fixe mais le corps est redimensionnable. Par contre, pour la version smartphone, le corps occupera toute la largeur naturellement vu que le menu vient se mettre sur l'écran quand on clique sur l'hamburger.

    Dans ce cas-ci, je pense que je devrais pour utiliser les grids pour la mise en page.

    Je ne sais pas ce que vous en pensez ?

    Merci d'avance

    Passez une agréable journée,
    Thierry

  4. #4
    Invité
    Invité(e)
    Par défaut
    Je t'ai donné de nombreux liens vers des exemples avec flexbox.

    Concernant grid, je ne l'utilise pas (pas l'utilité, pas l'envie d'apprendre...).
    A toi de te faire la main dessus.

    "On ne se sert pas d'un canon pour écraser une mouche".
    Commence par des mises en page SIMPLES !

    EN TOUT CAS : DESSINE (sur PAPIER !) les mises en pages que tu veux obtenir :
    Ça te permettra de faire un "découpage" en "boites", à placer, imbriquer,....

  5. #5
    Membre confirmé
    Homme Profil pro
    Consultant informatique
    Inscrit en
    Août 2019
    Messages
    51
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 46
    Localisation : Belgique

    Informations professionnelles :
    Activité : Consultant informatique
    Secteur : Finance

    Informations forums :
    Inscription : Août 2019
    Messages : 51
    Par défaut
    Bonjour Jérôme,

    merci pour tous vos conseils ...

    Bon week-end d'avance.
    Thierry

Discussions similaires

  1. bug dans IE11 en utilisant la propriété flex sur un <table>
    Par _youri dans le forum Mise en page CSS
    Réponses: 6
    Dernier message: 20/05/2018, 11h02
  2. [Débutant] WPF - Utilisation Grid dynamique
    Par Fellerson dans le forum C#
    Réponses: 7
    Dernier message: 12/09/2017, 18h42
  3. Utiliser Flash ou Flex?
    Par fredlang dans le forum Flash/Flex
    Réponses: 2
    Dernier message: 23/05/2012, 16h54
  4. [Débutant] utiliser Grid et fill ou patch en meme temps
    Par abdouccu dans le forum MATLAB
    Réponses: 4
    Dernier message: 27/01/2012, 00h06
  5. utiliser l'outil flex
    Par 080983 dans le forum Autres éditeurs
    Réponses: 0
    Dernier message: 03/12/2009, 20h21

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo