Cassiopeia : module personnalisé "banner"

Réduire
X
 
  • Filtrer
  • Heure
  • Afficher
Tout effacer
nouveaux messages

  • Cassiopeia : module personnalisé "banner"

    Bonjour,

    Je tente a grand renfort de tests en css de mettre en place un "banner" avec un module personnalisé dans la position "banner" et une mise en page "banner" dans les paramètres avancés.
    Cela donne un texte avec une image de fond fixe. Il y a pas mal de tutos a ce sujet.

    Mon souci est que j'aimerais mettre comme background une image avec un sujet du doit rester visible lorsque le site est sur ordinateur et également sur mobile :

    Le sujet doit se mettre a gauche en tout temps :

    Cliquez sur l'image pour l'afficher en taille normale

Nom : sujet2.png 
Affichages : 14 
Taille : 47,2 Ko 
ID : 2066936 Cliquez sur l'image pour l'afficher en taille normale

Nom : sujet1.png 
Affichages : 13 
Taille : 18,2 Ko 
ID : 2066937

    Pour ne pas avoir un trop grand banner, j'ai réduit ce dernier avec :

    Code:
    .container-banner .banner-overlay{
    height:30vh;
    }
    ​
    Mais j'ai tout essayé (sauf ce qu'il faut j'imagine) pour que mon image reste toujours à sa place (c'est un montage PS ) :

    Cliquez sur l'image pour l'afficher en taille normale

Nom : sujet3.png 
Affichages : 13 
Taille : 29,9 Ko 
ID : 2066939 Cliquez sur l'image pour l'afficher en taille normale

Nom : sujet4.png 
Affichages : 13 
Taille : 82,4 Ko 
ID : 2066938

    J'ai tenté avec des backgroud-size / backgroud-position (-x / -y) ... rien n'y fait .... soit l'image est trop grande, soit elle ne remplit pas tout l'espace ou se répète ...

    LK'image à la base est de 250 x 1900px pour assurer la largeur, mais ... rien n'y fait !

    Une idée ?




  • #2
    Bonjour,
    Avez vous testé en html :
    Code HTML:
     <img src="..." class="img-fluid" alt="...">
    Doc BS : https://getbootstrap.com/docs/5.3/content/images/

    Commentaire


    • #3
      Bonjour,

      Habituellement, par défaut l'image s'adapte automatiquement.
      Au besoin, une largeur de 100% et une hauteur auto peuvent être définies, sans besoin de forcer un style.
      A moins que je n'ai pas bien compris la question.
      "Patience et longueur de temps font plus que force ni que rage..." (La Fontaine : Le Lion et le Rat) - "Il n'y a pas de problèmes; il n'y a que des solutions" (André Gide).
      MoovJla et LazyDbBackup sur www.joomxtensions.com - FaQ sur www.fontanil.info - Site pro : www.robertg-conseil.fr chez PHPNET, sites perso chez PlanetHoster + sites gérés chez PHPNET, PlanetHoster, Ionos et OVH

      Commentaire

      Annonce

      Réduire
      Aucune annonce pour le moment.

      Partenaire de l'association

      Réduire

      Hébergeur Web PlanetHoster
      Travaille ...
      X