1 Discussione di Katryne

  • Katryne
  • Katryne
  • Moderator
  • Offline
  • Da: Revest en Provence
  • Registrato: 30/05/2016
  • Messaggi: 928

Discussione: Apparence du menu mobile

Hello coucou, ici le Consortium Franco-Belge !

Alain souligne une anomalie sur les menus mobiles : son fond en couleur prend toute la largeur, alors que le reste du site est plus étroit. Une bonne image vaut mieux que mille explications

http://image.prntscr.com/image/37b5ea499d92467da4c8b1afdfd5c928.png

Je constate le même affichage avec tous mes thèmes qui n'ont pas un fond de header homogène à 100 % de la largeur.

Comment peut-on obtenir la même largeur d'affichage pour la zone de menu mobile et le reste du site ?

Alain souhaiterait que le menu fasse partie des extensions, de façon à pouvoir proposer d'autres systèmes sans forker le cms.

Merci de ton aide

http://creasite.babelleir.be/index.php

Katryne : Website

2 Risposta di Alain

  • Alain
  • Moderator
  • Offline
  • Registrato: 03/06/2016
  • Messaggi: 366

Re: Apparence du menu mobile

roll une solution ?¿?

3 Risposta di Alain

  • Alain
  • Moderator
  • Offline
  • Registrato: 03/06/2016
  • Messaggi: 366

Re: Apparence du menu mobile

wink  Coucou,

http://creasite.babelleir.be/images/zoro/ane-zozor19.png

4 Risposta di Penanders

  • Penanders
  • Administrator
  • Offline
  • Da: Italia / Roma
  • Registrato: 28/05/2016
  • Messaggi: 760

Re: Apparence du menu mobile

Ciao Alain

Désolé, je n'avais pas reçu les messages de ce post. Peux tu me donner un lien pour tester?

A++

5 Risposta di Alain

  • Alain
  • Moderator
  • Offline
  • Registrato: 03/06/2016
  • Messaggi: 366

Re: Apparence du menu mobile

wink  Coucou Aless,

CréaSite.babelleir.be

mais aussi des sites de Kat ...


cool
Bien à toi

6 Risposta di Katryne

  • Katryne
  • Katryne
  • Moderator
  • Offline
  • Da: Revest en Provence
  • Registrato: 30/05/2016
  • Messaggi: 928

Re: Apparence du menu mobile

http://image.prntscr.com/image/f6ab984ca1bf4b39a1cd7b6164c16c50.png

Katryne : Website

7 Risposta di Penanders

  • Penanders
  • Administrator
  • Offline
  • Da: Italia / Roma
  • Registrato: 28/05/2016
  • Messaggi: 760

Re: Apparence du menu mobile

Allo Alain

je pense que la difficulté vient de la complexité de ton css.

j'obtiens ça

http://i.share.pho.to/f984a6d4_o.png

en donnant tout simplement

#container {width: 96%;}

et 

#menu-bar {width: 96%;}

si tu veux essaie de réviser/simplifier un peu le style de ton thème .

Mais enfin je te demande... sur un petit écran c'est utile de faire ça? roll

8 Risposta di Katryne

  • Katryne
  • Katryne
  • Moderator
  • Offline
  • Da: Revest en Provence
  • Registrato: 30/05/2016
  • Messaggi: 928

Re: Apparence du menu mobile

On rencontre ce souci chaque fois quand le header n'est pas pleine largeur.
Si le header est pleine largeur, même avec le reste du site à 80 %, il n'ya pas ce défaut d'affichage.
Dis-nous comment faire.

http://image.prntscr.com/image/8f39cb7465e84fe7a6780aa81c48e2f8.png

Katryne : Website

9 Risposta di Alain

  • Alain
  • Moderator
  • Offline
  • Registrato: 03/06/2016
  • Messaggi: 366

Re: Apparence du menu mobile

hmm,

voilà les changement sont fait... mais rien ne change



cool

10 Risposta di Penanders

  • Penanders
  • Administrator
  • Offline
  • Da: Italia / Roma
  • Registrato: 28/05/2016
  • Messaggi: 760

Re: Apparence du menu mobile

Pour le site de Alain

dans la section des media query max-width:900px vers la ligne 6938 ( roll ) ajoute

  #container {
    margin:auto;
    width: 96%;
    padding:0;
  }

à la ligne 6968 modifie

width: 100%;

en

width: 96%;

tu obtiens ça

http://i.share.pho.to/4c2ff813_o.png

je te laisse le reste du travail à faire sur les bordure etc

A++

11 Risposta di Penanders

  • Penanders
  • Administrator
  • Offline
  • Da: Italia / Roma
  • Registrato: 28/05/2016
  • Messaggi: 760

Re: Apparence du menu mobile

@Katryne @bambù


si tu veux modifie la ligne 90

nav#menu-bar {

en

#menu-bar {

je te laisse le reste big_smile

12 Risposta di Alain

  • Alain
  • Moderator
  • Offline
  • Registrato: 03/06/2016
  • Messaggi: 366

Re: Apparence du menu mobile

big_smile

juste

left: 2%;

en plus

Post's attachments

pouce2.gif 15.02 kb, file has never been downloaded. 

You don't have the permssions to download the attachments of this post.

13 Risposta di Penanders Ultima modifica di Penanders (09/01/2017 22:34:43)

  • Penanders
  • Administrator
  • Offline
  • Da: Italia / Roma
  • Registrato: 28/05/2016
  • Messaggi: 760

Re: Apparence du menu mobile

@Kat @tempsmieux

quelques suggestions de modification

à ligne 604

width:96%; 
padding:0;

à la ligne 544 supprime le code pour la classe .wrapper

Tu ne utilises pas le même sélecteur pour le css générale et pour les mediaqueries.
Pour exemplifier il faudrait toujours appeler le meme selecteur pour le  #menu-bar autant que là tu utilises

nav#menu-bar (ligne 571)
#menu-bar (ligne 564)
#menu-bar (ligne 309 -vide!!)

je conseille de supprimer du tout le code pour nav#menu-bar à partir de la ligne 571

modifie la ligne 567 en

width: 96%;

enfin pour cacher le menu modifie la ligne 313 tout simplement en

ul#menu {

le résultat finale devrait être ça

http://i.share.pho.to/804b4445_o.png


Il te restera de tester/adapter le style à chaque mediaquery que tu utilises dans ton fichier css.

Amuse toi bien 

A++

14 Risposta di Katryne

  • Katryne
  • Katryne
  • Moderator
  • Offline
  • Da: Revest en Provence
  • Registrato: 30/05/2016
  • Messaggi: 928

Re: Apparence du menu mobile

Merci Ale ! J'y suis presque pour Bambou. La couleur verte a envahi toute la largeur (et c'est mieux quand je mets des { } au lieu de [ ], le code s'exécute mieux ...
J'ai encore des petits soucis en mode mobile:
- mon menu s'affiche d'abord déplié, je ne comprends pas pourquoi.
- je n'ai pas de bouton de connexion
- je ne sais pas mettre les drapeaux à droite

Katryne : Website

15 Risposta di Katryne

  • Katryne
  • Katryne
  • Moderator
  • Offline
  • Da: Revest en Provence
  • Registrato: 30/05/2016
  • Messaggi: 928

Re: Apparence du menu mobile

Ale ! you là !!! heu, Allelouia ...
C'est parfait pout le site de test de Temps mieux, je vais aller le porter sur le site vivant. Merciiiiiiiii !
Et je vais tenter de faire pareil sur Bambou qui soufre encore des mêmes erreurs des bidouilles-à-kat.

Katryne : Website