Mettre une icone en dessous EN DESSOUS des titres de sujet

2 participants

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

Résolu Mettre une icone en dessous EN DESSOUS des titres de sujet

Message par Féline1984 Mer 9 Mar 2022 - 7:28

Détails techniques


Version du forum : phpBB3
Poste occupé : Administrateur
Navigateur(s) concerné(s) : Autre
Capture d'écran du problème :
Voir l'image:

Personnes concernées par le problème : Tous les utilisateurs
Problème apparu depuis : 1er mars 2022, date de la création de ce forum
Lien du forum : "Terre-TSA" : https://www.terre-tsa.com/

Description du problème

Bonjour,

J'avais déjà évoqué ce problème pour un autre de mes forums :
https://forum.forumactif.com/t406079-mettre-les-icones-de-sujet-entre-le-logo-nouveau-et-le-titre-des-sujets

J'avais mis ce code CSS :
Code:

/** Début marges icones de sujet  **/
.topiclist.bg_none .dterm {
    background-position: 50px 45px;
}
 
.topiclist.bg_none .dterm, .topiclist.bg_none dd.posts, .topiclist.bg_none dd.topics, .topiclist.bg_none dd.views, .topiclist.bg_none dd.lastpost {
    height: 75px;
}
/** Fin marges icones de sujet  **/

Et ça avait marché, le sujet était résolu, mais maintenant, j'ai le même problème avec mon nouveau forum "Terre-TSA", voir ce sous-forum : https://www.terre-tsa.com/f38-pays-de-la-loire

Voilà les codes CSS de "Terre-TSA" :
Code:
/** Début marges icones de sujet  **/
.topiclist.bg_none .dterm {
    background-position: 50px 45px;
}
 
.topiclist.bg_none .dterm, .topiclist.bg_none dd.posts, .topiclist.bg_none dd.topics, .topiclist.bg_none dd.views, .topiclist.bg_none dd.lastpost {
    height: 75px;
}
/** Fin marges icones de sujet  **/

/** Début de enlever le caractère gras du TEXTE messages  **/
 .postbody .content {
    font-size: 15px;

/** Fin enlever le caractère gras du TEXTE messages  **/
 
   
   
/** Début enlever le caractère gras du TITRE des messages **/ 
.postbody .topic-title {
    font-weight: 400;
    font-size: 17px;

/** Fin enlever le caractère gras du TITRE des messages  **/

/** Début enlever les lettres capitales du TITRE des catégories  **/
li.header dd, li.header dt {
    text-transform: none;
}
/** Fin enlever les lettres capitales du TITRE des catégories  **/

/** DEBUT mettre bordure au widgets  **/
.module {
    border : 1px solid #655487;
    padding:0;
}
/** Fin mettre bordure au widgets  **/

/** Début haut des widgets  **/
.module .h3 {
    background: url('https://i.servimg.com/u/f29/20/00/85/54/celpic11.jpg') top center repeat; /* image de fond et positionnement */
    padding: 1rem 5px; /* espacement horizontal et vertical autour du titre */
    text-transform: none; /* pas de transformation du texte en majuscules */
    color: #FFFFFF; /* couleur du texte */
    margin-top: -5px; /* suppression d'une marge en haut qui gène un peu */
}
/** Fin haut des widgets  **/


/** Début de mettre un cadre sur les messages postés **/
.post {
    border: 1px solid #655487;
}
/** Fin de mettre un cadre sur les messages postés **/


/** Début enlever contre les avatars qui dépassent sur le message **/
.postprofile img {
    max-width: 100%;
}
/** Début enlever contre les avatars qui dépassent sur le message **/ 

/** Début marges icones de sujet  **/
.topiclist.bg_none .dterm {
    background-position: 50px 45px;
}
 
.topiclist.bg_none .dterm, .topiclist.bg_none dd.posts, .topiclist.bg_none dd.topics, .topiclist.bg_none dd.views, .topiclist.bg_none dd.lastpost {
    height: 75px;
}
/** Fin marges icones de sujet  **/

Voir mes icones de sujets : https://www.terre-tsa.com/post?f=38&mode=newtopic

Merci d'avance pour votre aide Smile
Féline1984

Féline1984
***

Féminin
Messages : 105
Inscrit(e) le : 14/09/2018

Voir le profil de l'utilisateur http://felinepub.forumactif.com/
Féline1984 a été remercié(e) par l'auteur de ce sujet.
  • 0

Résolu Re: Mettre une icone en dessous EN DESSOUS des titres de sujet

Message par Toryudo Mer 9 Mar 2022 - 11:52

Bonjour !
On peut tenter autrement pour le background-position :
Code:
.topiclist.bg_none .dterm {
    background-position: 50px 100%;
}

Ainsi, on le positionne en le décalant de 50px à gauche, et surtout, on le met tout en bas quelle que soit la taille height précisée pour la ligne. S'il y a trop de texte, la solution sera d'augmenter ce height, et l'image descendra toute seule !
Toryudo

Toryudo
****

Masculin
Messages : 426
Inscrit(e) le : 31/03/2020

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

Résolu Re: Mettre une icone en dessous EN DESSOUS des titres de sujet

Message par Féline1984 Mer 9 Mar 2022 - 14:43

Bonjour Toryudo

J'ai mis votre code CSS, mais ça ne marche pas :

Mes codes CSS :
Code:
/** Début marges icones de sujet  **/
.topiclist.bg_none .dterm {
    background-position: 50px 100%;
}
/** Fin marges icones de sujet  **/

/** Début de enlever le caractère gras du TEXTE messages  **/
 .postbody .content {
    font-size: 15px;

/** Fin enlever le caractère gras du TEXTE messages  **/
 
   
   
/** Début enlever le caractère gras du TITRE des messages **/ 
.postbody .topic-title {
    font-weight: 400;
    font-size: 17px;

/** Fin enlever le caractère gras du TITRE des messages  **/

/** Début enlever les lettres capitales du TITRE des catégories  **/
li.header dd, li.header dt {
    text-transform: none;
}
/** Fin enlever les lettres capitales du TITRE des catégories  **/

/** DEBUT mettre bordure au widgets  **/
.module {
    border : 1px solid #655487;
    padding:0;
}
/** Fin mettre bordure au widgets  **/

/** Début haut des widgets  **/
.module .h3 {
    background: url('https://i.servimg.com/u/f29/20/00/85/54/celpic11.jpg') top center repeat; /* image de fond et positionnement */
    padding: 1rem 5px; /* espacement horizontal et vertical autour du titre */
    text-transform: none; /* pas de transformation du texte en majuscules */
    color: #FFFFFF; /* couleur du texte */
    margin-top: -5px; /* suppression d'une marge en haut qui gène un peu */
}
/** Fin haut des widgets  **/


/** Début de mettre un cadre sur les messages postés **/
.post {
    border: 1px solid #655487;
}
/** Fin de mettre un cadre sur les messages postés **/


/** Début enlever contre les avatars qui dépassent sur le message **/
.postprofile img {
    max-width: 100%;
}
/** Début enlever contre les avatars qui dépassent sur le message **/ 


Mais merci quand-même Smile
Féline1984

Féline1984
***

Féminin
Messages : 105
Inscrit(e) le : 14/09/2018

Voir le profil de l'utilisateur http://felinepub.forumactif.com/
Féline1984 a été remercié(e) par l'auteur de ce sujet.
  • 0

Résolu Re: Mettre une icone en dessous EN DESSOUS des titres de sujet

Message par Toryudo Mer 9 Mar 2022 - 17:36

Ah ! En effet, vous avez retiré l'autre, il fallait le laisser !
Je vous remets les deux au propre :
Code:
/** Début marges icones de sujet  **/
.topiclist.bg_none .dterm {
    background-position: 50px 100%;
}
.topiclist.bg_none .dterm, .topiclist.bg_none dd.posts, .topiclist.bg_none dd.topics, .topiclist.bg_none dd.views, .topiclist.bg_none dd.lastpost {
    height: 75px;
}
/** Fin marges icones de sujet  **/
Toryudo

Toryudo
****

Masculin
Messages : 426
Inscrit(e) le : 31/03/2020

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

Résolu Re: Mettre une icone en dessous EN DESSOUS des titres de sujet

Message par Féline1984 Mer 9 Mar 2022 - 17:48

Bonjour

Ca fonctionne, voilà le code que j'ai mis : https://www.terre-tsa.com/f38-pays-de-la-loire
Code:
/** Début marges icones de sujet  **/
.topiclist.bg_none .dterm {
    background-position: 50px 100%;
}
.topiclist.bg_none .dterm, .topiclist.bg_none dd.posts, .topiclist.bg_none dd.topics, .topiclist.bg_none dd.views, .topiclist.bg_none dd.lastpost {
    height: 75px;
}
/** Fin marges icones de sujet  **/

Merci beaucoup à vous deux Mettre une icone en dessous EN DESSOUS des titres de sujet 1f44d
Féline1984

Féline1984
***

Féminin
Messages : 105
Inscrit(e) le : 14/09/2018

Voir le profil de l'utilisateur http://felinepub.forumactif.com/
Féline1984 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