Position du texte bas de page en version mobile

[adls33]

Bonjour,

Je suis sur Prestashop 1.7.8.11

Je cherche à aligner les liens suivants : votre compte, produits, notre société,

sur informations.

J'ai épluché le code via l'émulateur d'appareil pour la version mobile, mais je ne trouve pas ... 

Si j'utilise ceci dans le fichier custom :.col-md-6 {margin-top: -10px;float: left;width: 100%;}

l'affichage mobile est aligné, mais ceci aligne à gauche l'affichage pc...

Merci d'avance pour votre aide !

[ComGrafPL]

Est-ce une nouvelle boutique ? Si oui, pourquoi l'avez-vous fait sur la version 1.7 ? Partagez l'URL. Nous pourrions donc y jeter un œil.

[Mediacom87]

Il y a 2 heures, adls33 a dit :

Si j'utilise ceci dans le fichier custom :.col-md-6 {margin-top: -10px;float: left;width: 100%;}

Vous modifiez un élément d'affichage d'écran de tablette pour votre affichage mobile, quelle drôle d'idée.

Si vous souhaitez utiliser les bonnes méthodes, il serait bon de vous familiariser avec le système de grille proposé par Bootstrap : https://getbootstrap.com/docs/3.3/css/#grid-options

[adls33]

Bonjour,

oui, on peut considérer que c'est une nouvelle boutique. Le choix de la version ? disons que du point de vue d'un newbie comme moi, c'était proche de l'ancienne version 1.6 installée par mon développeur (qui a fermé) et pas trop éloignée des versions 8 récentes peut-être pas assez aboutie ?...
Je précise qu'avant de mettre les mains dans le cambouis, j'ai tenté de trouver un prestataire en local, mais en vain. J'ai récemment fait appel à un développeur freelance pour des tâches pour le moment inaccessibles pour moi.

Mais j'ai pour habitude de chercher à comprendre, même si je peux paraitre farfelu par mes questions, sachez que j'ai cherché à comprendre avant de solliciter votre aide.

Je vais étudier le lien de Mediacom87.

Voici le lien vers mon site : Avenuedelasecurite.fr

Je vous encourage à me communiquer toutes les remarques visant à son amélioration.

Merci d'avance pour votre soutien.

[Mediacom87]

Il y a 2 heures, adls33 a dit :

Voici le lien vers mon site : Avenuedelasecurite.fr

Retirez ce que vous avez mis dans custom.css

.col-md-6 {
	/* margin-top: 20px; */
	/* float: left; */
	/* width: 50%; */
}

Le choix de vouloir mettre sur la même ligne tous ces éléments me semble étrange, car ce sont des éléments qui doivent se déplier sur mobile, donc les uns sous les autres pour avoir l'espace pour afficher le contenu.

Si vous voulez un autre comportement, il va falloir aller plus loin et préciser clairement ce que vous voulez.

Mais je le répète, ne modifiez pas le comportement d'un élément de design standardisé, créez des choses nouvelles ou utiliser les possibilités du framework bootstrap.

[adls33]

Bonjour,

en effet, cela règle le problème. merci !

J'ai noté dans mon custom, ceci /*augmenter la marge en haut de la fiche*/.col-md-6 {margin-top: 20px;float: left;width: 50%;}

visiblement pas la bonne méthode...J'avoue faire l'apprentie sorcier en utilisant l'inspecteur. J'ai lu votre page sur Bootstrap qui renvoi sur des pré-requis que je tente progressivement d'assimiler.

Donc, c'est parti de l'idée d'augmenter l'espace sous la ligne de lien en haut de la fiche produit et avant l'image et le titre

peut-être en ajoutant cette règle ? :

#wrapper .breadcrumb {
    margin-bottom: 30px; <-----
    background: transparent;
}

[Mediacom87]

Le mieux est de toujours reprendre la classe que l'on modifie.

Dans votre cas c'est .breadcrumb et non le #wrapper, car vous souhaitez une cohérence pour chaque affichage du breadcrumb.

Aussi, on conserve l'unité utilisée sur la variable et non pas un coup des rem et d'autres des px.

Après, on regarde entre les affichages mobile, tablette et desktop si tout va bien, sinon on adapte en fonction du support.

[adls33]

Ok, je vais tâcher de suivre cette voie;

Merci pour votre soutien!