Empêcher l'affichage d'un champ flexicontent sur petits écrans

Réduire
Ce sujet est fermé.
X
X
 
  • Filtrer
  • Heure
  • Afficher
Tout effacer
nouveaux messages

  • [RÉGLÉ] Empêcher l'affichage d'un champ flexicontent sur petits écrans

    Bonjour,

    Je me suis dit que ça faisait trop longtemps que je n'avais pas abusé de votre temps, aussi me voilà avec une nouvelle question :

    Je souhaite empêcher un des champs du (sous) template FlexiContent de s'afficher lorsque la largeur d'écran est inférieure à 710 px.
    Le champ que je vise est la toolbar dans laquelle sont rangées les boutons agrandir la police, envoyer par mail, imprimer, et 3 boutons de partage : d'abord parce qu'elle est moche sur petit écran (elle passe sur 2 lignes et les boutons de partage deviennent alors invisibles), ensuite et surtout parce qu'elle est alors totalement inutile (agrandir et imprimer n'ont aucun sens sur smartphone, et il y a bien d'autres façons de partager que d'utiliser ces boutons depuis un smartphone...)

    Comme on me l'a appris ici même, je vais devoir instruire un media query dans le custom css, mais franchement je me demande bien comment il faut écrire ça ???

    Voici 3 captures d'écran montrant les 3 éléments qui peuvent, à mes yeux de novice, avoir un rôle à jouer : lequel dois-je empêcher de s'afficher en dessous de 710 px, et puis, comment écrire "ne t'affiche pas" ?
    Cliquez sur l'image pour l'afficher en taille normale

Nom : flexi topblock.jpg 
Affichages : 1 
Taille : 38,3 Ko 
ID : 1820883
    Cliquez sur l'image pour l'afficher en taille normale

Nom : flexi infoblock.jpg 
Affichages : 1 
Taille : 37,9 Ko 
ID : 1820885
    Cliquez sur l'image pour l'afficher en taille normale

Nom : ul flexi.jpg 
Affichages : 1 
Taille : 38,1 Ko 
ID : 1820886

    L'URL du site est visible sur les captures.
    Je pense à des trucs avec du
    display: none
    dedans, et du
    @media screen and (max-width: 710px) {

    #flexicontent .flexi.topblock {

    ... mais avec ça je suis bien avancée... D'où mon appel à l'aide.

    Aide pour laquelle je vous remercie d'ores et déjà par avance, les gars
    Flo, Ariège

    Il n'y a que celui qui a honte d'apprendre qui a peur de demander

  • #2
    Re : Empêcher l'affichage d'un champ flexicontent sur petits écrans

    Bon alors... (je me réponds à moi même ! )
    J'ai bidouillé ceci, et ça fonctionne :

    @media only screen and (max-width: 710px) {
    .flexi.topblock {
    display: none;
    }

    }

    J'espère ne pas avoir "pété" autre chose sans le vouloir et avoir respecté les règles du css, mais bon... ça marche (j'en reviens pas).
    @+
    Flo, Ariège

    Il n'y a que celui qui a honte d'apprendre qui a peur de demander

    Commentaire


    • #3
      Re : Empêcher l'affichage d'un champ flexicontent sur petits écrans

      Il ne te reste plus qu'à passer le post en [RÉGLÉ]
      Lorsque l'on se cogne la tête contre un pot et que cela sonne creux, ça n'est pas forcément le pot qui est vide.
      Confucius

      Commentaire

      Annonce

      Réduire
      Aucune annonce pour le moment.

      Partenaire de l'association

      Réduire

      Hébergeur Web PlanetHoster
      Travaille ...
      X