Flexbox qui marche seulement en dehors de Wordpress

WordPress :6.0
Statut : résolu

Ce sujet contient 6 réponses, 3 participants et a été mis à jour pour la dernière fois par laurentsc, le il y a 2 années et 8 mois.

7 sujets de 1 à 7 (sur un total de 7)

Auteur

Messages
2 novembre 2022 à 22 h 27 min #2428404
laurentsc
Participant

Chevalier WordPress
367 contributions
Bonjour,

Ma configuration WP actuelle
- Version de PHP/MySQL : 8/8
- Thème utilisé : OceanWP
- Extensions en place :
- Nom de l’hébergeur : local
- Adresse du site : xxx
Problème(s) rencontré(s) : Voici un code :

code HTML :
```
<!doctype html>
<html lang="fr">
<head>
    <meta charset="utf-8">
    <title>Titre de la page</title>
    <link rel="stylesheet" href="style2.css">

</head>
<body>

<div id="main-mention-legales">
    <div id="mention-legales-col1">
        <p>col1</p>
    </div>
    <div id="mention-legales-col2">
    <p>col2</p>
    </div>

</div>
<br/>
</body>
```
code CSS :
```
/* mentions légales */
#main-mention-legales{
    display:flex;
    flex-direction:row;
    justify-content:space-around;
    text-align:left;
}

#mention-legales-col1{
    order:1;
}

#mention-legales-col2{
    order: 2;
}

#mention-legales-col1,#mention-legales-col2{
    height:1400px;
    border:3px;
    border-color:#000;
    border-style: solid;
    margin-right:5px;
    padding-left:20px;
    width:800px!important;
}
```
si on le place en dehors de WordPress, le comportement est bien de type flexbox, mais si je crée une page test-flexbox :
```

<div id="main-mention-legales">
    <div id="mention-legales-col1">
        <p>col1</p>
    </div>
    <div id="mention-legales-col2">
    <p>col2</p>
    </div>

</div>
```
et le CSS en CSS additionnel. Là, les div ont un comportement de type block (alignement vertical). Quel est le problème, SVP ?
- Ce sujet a été modifié le il y a 2 années et 8 mois par laurentsc.
- Ce sujet a été modifié le il y a 2 années et 8 mois par laurentsc.
3 novembre 2022 à 7 h 29 min #2428455

momofr@free.fr
Modérateur

Maître WordPress
7834 contributions

Salut, tu as oublié de nous donner les informations sur les extensions utilisées.

Si tu utilises Elementor (conseillé avec ce thème), la FlexBox est intégrée.

3 novembre 2022 à 9 h 00 min #2428463

pasglop
Participant

Maître WordPress
702 contributions

Aucune différence de mon coté, l’affichage des deux colonnes est similaire, je viens de tester. Mais je passe par l’éditeur « natif », donc Gutenberg.

3 novembre 2022 à 9 h 08 min #2428468

laurentsc
Participant

Chevalier WordPress
367 contributions

Salut et merci pour ta réponse matinale…

tu as oublié de nous donner les informations sur les extensions utilisées

En fait, c’est plutôt par flemme vu que dans mes souvenirs, il y en avait pas loin de 30…sauf que depuis peu, j’ai démarré à coder en local (je suis en phase de mise au point) et sur ce site de test, il n’y en a encore que 4…Mais quand même une question : il m’arrive d’installer une extension puis de décider de ne plus m’en servir ; la désactiver mais la laisser installée suffit-il ou bien c’est mauvais pour la performance du site ?

Si tu utilises Elementor (conseillé avec ce thème), la FlexBox est intégrée.

Toi ou quelqu’un d’autre me l’a déjà conseillé, donc je vais m’y mettre…et reviendrais probablement avec des questions…

4 novembre 2022 à 10 h 09 min #2428724

laurentsc
Participant

Chevalier WordPress
367 contributions

Si tu utilises Elementor (conseillé avec ce thème), la FlexBox est intégrée.

Ca serait pas uniquement avec elementor pro ?

https://www.youtube.com/watch?v=GoykzyKqYM4

4 novembre 2022 à 10 h 38 min #2428730

momofr@free.fr
Modérateur

Maître WordPress
7834 contributions

Salut, la Flexbox est une expérience à activer dans les réglages d’Elementor. C’est encore en bêta mais c’est stable, j’ai une trentaine de sites qui l’utilisent sans souci.

C’est disponible dans la version gratuite.

4 novembre 2022 à 13 h 20 min #2428773

laurentsc
Participant

Chevalier WordPress
367 contributions

C’est top ; j’ai pu l’utiliser. Très content…
Auteur

Messages