Affichage avatars - Catégorie - Chrome

4 participants

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu Affichage avatars - Catégorie - Chrome

Message par Zarby Mer 23 Mar 2022 - 20:23

Détails techniques


Version du forum : phpBB2
Poste occupé : Fondateur
Navigateur(s) concerné(s) : Google Chrome
Capture d'écran du problème :
Voir l'image:

Personnes concernées par le problème : Plusieurs utilisateurs
Problème apparu depuis : trois semaines (+ ou -)
Lien du forum : http://bloody-crown.forumactif.org/

Description du problème

Bonsoir,

Je rencontre un problème depuis quelques semaines maintenant, problème touchant des membres ayant le navigateur chrome : les avatars sur les catégories n'apparaissent plus sur Bloody Crown. (voir capture écran). Pas de problème sur Firefox.

Le code a été installé de prime abord sur mon forum test et il fonctionne parfaitement. Les avatars s'affichent bien. J'ai copier/coller le code du forum test au forum de BC et cela n'a rien changer. J'ai décocher et cocher la case qui affiche les avatars, et cela n'a rien changer. J'ai vidé les données de navigations de mon navigateur et cela n'a rien changé.

Je ne comprends donc pas d'où vient le problème, car sur mon forum test, tout est ok mais pas sur BC. Et les codes sont identiques.

Je me tourne donc vers vous pour trouver une solution autre que de changer tous les codes et faire disparaitre les avatars pour tous, qui rend le tout plus esthétique.

Merci par avance !

___________________ index_box
Code:
<link href="https://fonts.googleapis.com/css2?family=Josefin+Slab&display=swap" rel="stylesheet">
<!-- BEGIN catrow -->
    <div class="CatFd">
      <!-- BEGIN tablehead -->
        <div class="CatGdTitFd">{catrow.tablehead.L_FORUM}</div>

        <div class="CatFo" id="{catrow.tablehead.ID}">
    <!-- END tablehead -->

    <!-- BEGIN forumrow -->
            <div class="AlignDiv">
            <div class="CatP4">
                <div class="CatStatut"><img src="{catrow.forumrow.FORUM_FOLDER_IMG}" alt="{catrow.forumrow.L_FORUM_FOLDER_ALT}" />
                </div>
                <div class="CatP4LPC"> 
                    <div class="CatLastP"><!-- BEGIN switch_topic_title --><a href="{catrow.forumrow.U_LATEST_TOPIC}" title="{catrow.forumrow.LATEST_TOPIC_TITLE}">{catrow.forumrow.LATEST_TOPIC_NAME}</a><br /><!-- END switch_topic_title -->{catrow.forumrow.USER_LAST_POST}
                        <div class="CatChif">{catrow.forumrow.POSTS} messages, {catrow.forumrow.TOPICS} sujets.
                        </div>
                    </div>
                </div>
            </div>
            </div>
            <div class="AlignDiv">
            <div class="CatP3"> <!-- BEGIN avatar --><div class="CatAva">{catrow.forumrow.avatar.LAST_POST_AVATAR}</div>
            <!-- END avatar -->
              </div>
            </div>
            <div class="AlignDiv">
                <div class="CatP1">
                <div class="CatTitFo"><a href="{catrow.forumrow.U_VIEWFORUM}" class="forumtitle">{catrow.forumrow.FORUM_NAME}</a></div>
                <div class="CatSoFo"><div class="CatSautLigne">{catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}</div></div>
            </div>
            </div>
            <div class="AlignDiv">
            <div class="CatP2">
                  <div class="CatDes">{catrow.forumrow.FORUM_DESC}</div>
            </div>
            </div>               
        </div>
    <!-- END forumrow -->

    <!-- BEGIN tablefoot -->
          <div class="CatCred">(c) Kanala</div>
    <!-- END tablefoot -->
    </div>
<!-- END catrow -->

<!-- BEGIN switch_on_index -->

<!-- END switch_on_index -->

  <script type="text/javascript">$('.CatSautLigne').each(function(){$(this).html($(this).html().replace(/,/g,"<br />"));});</script>

_________________ CSS associé
Code:
/********************************-- Codage des catégories du forum --**********************/
.CatFd{
width:900px;
text-align:center;
background-color: #F0F0F0;}

.CatGdTitFd{background: url(https://i.ibb.co/FxwwbNM/fondcat-Tt.png);transition: 0.7s;}

.CatGdTitFd h2 {
font-family: 'Josefin Slab', serif;
font-size: 25px !important;
text-transform: uppercase;
border-bottom:3px solid #E7BA55;
transition: 0.7s;
padding:10px;
color:#fff;}

.CatGdTitFd h2:hover{filter: invert(1);
-webkit-filter: invert(1);
color:#C74848;
letter-spacing: .2rem;}

.CatFo{border-top: 20px solid #DADADA;margin-top:-20px;}

.CatP1{
background-color: #DADADA;
width:180px;
margin-left:20px;
margin-top:10px;
padding:5px;}

.CatTitFo{
border: 1px solid #000;
margin-bottom:5px;
font-family: 'Josefin Slab', serif;
text-transform: uppercase;
background: rgb(122,121,121);
background: linear-gradient(322deg, rgba(122,121,121,1) 0%, rgba(71,52,52,1) 25%, rgba(64,63,63,1) 50%, rgba(91,68,68,1) 78%, rgba(64,53,53,1) 100%);
color:#fff;
padding:2px;}

.CatTitFo a{
color:#fff;
text-decoration: none;
transition: 0.7s;
font-size:12px;} 

.CatTitFo a:hover{color:#E7BA55;text-decoration: none;} 

.CatSoFo{
height: 70px;
overflow:auto;
border : 1px solid #000;
padding:5px;
border-top:1px solid #E7BA55;}

.CatSoFo a::before{content: "→ ";color:#E7BA55;}

.CatSoFo a::after{content: " ←";color:#E7BA55;}

.CatP2{
background-color: #DADADA;
width:320px;
margin-left:10px;
margin-top:10px;}

.CatDes{
text-align:justify;
width:310px;
height: 100px;
overflow:auto;
padding:5px;
font-size:12px;
border-bottom:1px solid #E7BA55;}

.CatStFo{
text-transform: uppercase;
font-family: 'Josefin Slab', serif;
color:#fff;
padding-top:2px;
padding-right:5px;
padding-left:5px;
background: rgb(156,170,168);
background: linear-gradient(219deg, rgba(156,170,168,1) 0%, rgba(101,132,133,1) 25%, rgba(64,63,63,1) 50%, rgba(66,117,117,1) 78%, rgba(65,113,106,1) 100%);
font-size:12px;
border-bottom:1px solid #E7BA55;}

.CatP3{
width:90px;
margin-left:10px;
margin-top:10px;}

.CatAva img{
clip-path: polygon(50% 100%, 0% 0%, 100% 0%);
height:100px;
border:1px solid #E7BA55;
transition: 1.3s;}

.CatAva img:hover{filter: invert(1);-webkit-filter: invert(1);clip-path: polygon(50% 0%, 0% 100%, 100% 100%);}
 
.CatP4{
background-color: #DADADA;
margin-left:10px;
width:180px;
margin-right:20px;
margin-top:10px;
padding:5px;}

.CatStatut{border: 1px solid #000;
  margin-bottom:5px;
width:180px;}

.CatStatut img{width:180px;height:15px;}

.CatP4LPC{
width:170px;
height: 70px;
border : 1px solid #000;
padding:5px;
border-bottom:1px solid #E7BA55;}

.CatLastP{ font-size:11px;}

.CatChif{
margin-top :10px;
font-size:11px;
width:160px;
font-family: 'Josefin Slab', serif;
text-transform: uppercase;
background: linear-gradient(322deg, rgba(122,121,121,1) 0%, rgba(71,52,52,1) 25%, rgba(64,63,63,1) 50%, rgba(91,68,68,1) 78%, rgba(64,53,53,1) 100%);
color:#fff;
padding:2px;
border : 1px solid #000;}

.CatCred{
font-size:5px;
text-align:right;
text-transform: uppercase;
border-bottom: 20px solid #DADADA;
padding-right:20px;
padding-top:10px;}

Zarby

Zarby
**

Messages : 82
Inscrit(e) le : 01/10/2010

Voir le profil de l'utilisateur http://bloody-crown.forumactif.org/
Zarby a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Affichage avatars - Catégorie - Chrome

Message par chattigre Mer 23 Mar 2022 - 20:38

Bonsoir,

Je ne reproduis pas le souci de mon côté sous Google Chrome...

Si vous avez des extensions, testez en les désactivant pour voir si le problème persiste.
Je vous invite aussi à tester sous Google Chrome avec un autre appareil si vous en avez la possibilité Wink

Bonne journée
chattigre

chattigre
Membre actif

Masculin
Messages : 2043
Inscrit(e) le : 17/04/2019

Voir le profil de l'utilisateur https://test1-chattigre.forumactif.fr
chattigre a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Affichage avatars - Catégorie - Chrome

Message par MlleAlys Jeu 24 Mar 2022 - 18:36

Bonjour,
Pour ma part je reproduis bien le problème d'affichage sur Chrome.
Le souci a l'air de venir de la propriété clip-path : Si je la retire l'avatar apparait.... Mais si je la remets, l'avatar reste affiché scratch Donc je me dis que ce n'est pas la propriété elle même mais peut être l'ordre de prise en compte de celle-ci ?
Essayez peut être dans le css de mettre cette propriété plus bas, je ne sais pas si ça peut venir de là mais sait-on jamais, ça ne coûte pas grand chose d'essayer !
Localisez :
Code:
.CatAva img{
clip-path: polygon(50% 100%, 0% 0%, 100% 0%);
height:100px;
border:1px solid #E7BA55;
transition: 1.3s;}
Et modifiez ainsi :
Code:
.CatAva img{
height:100px;
border:1px solid #E7BA55;
clip-path: polygon(50% 100%, 0% 0%, 100% 0%);
transition: 1.3s;}
Enregistrez et actualisez ?
MlleAlys

MlleAlys
Membre actif

Messages : 5092
Inscrit(e) le : 12/09/2012

Voir le profil de l'utilisateur
MlleAlys a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Affichage avatars - Catégorie - Chrome

Message par Chacha Mar 29 Mar 2022 - 9:16

Affichage avatars - Catégorie - Chrome UmaslZ4Bonjour,

Attention, cela fait 6 jours que nous n'avons pas de nouvelles concernant votre demande, si vous ne voulez pas voir votre sujet déplacé à la corbeille, merci de poster dans les 24h qui suivent ce message.

Si votre sujet est résolu, merci d'éditer votre premier message et de cocher l'icône « résolu »
Chacha

Chacha
Modéractif
Modéractif

Masculin
Messages : 66959
Inscrit(e) le : 21/08/2010

Voir le profil de l'utilisateur https://forum.forumactif.com/
Chacha a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Affichage avatars - Catégorie - Chrome

Message par Chacha Mer 30 Mar 2022 - 9:13

Affichage avatars - Catégorie - Chrome 8djze9qBonjour,

Nous n'avons plus de nouvelle de l'auteur de ce sujet depuis plus de 7 jours. Nous considérons donc ce problème comme résolu ou abandonné. La prochaine fois, merci de nous tenir au courant de l'évolution de votre problème, ou pensez à faire un UP régulièrement !

Ce sujet est archivé afin de ne pas perdre les réponses apportées.
Chacha

Chacha
Modéractif
Modéractif

Masculin
Messages : 66959
Inscrit(e) le : 21/08/2010

Voir le profil de l'utilisateur https://forum.forumactif.com/
Chacha a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut

- Sujets similaires

Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum