CSS / décaler les icônes de messages dans la messagerie

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

Résolu CSS / décaler les icônes de messages dans la messagerie

Message par Albert (67) le Sam 22 Aoû 2015 - 12:13

Bonjour

Les infos du forum sont dans mon profil .

J' ai un CSS perso qui permet de décaler les icônes de messages dans la liste des sujets du forum, comme ci dessous :

Copie d' écran sujets:

Malheureusement, ces icônes chevauchent l' icône de sujet dans les différentes boîtes de messagerie .

Copie d' écran messagerie:

Mon CSS rajouté est le suivant :

CSS rajouté:
Code:
.topiclist dl.icon {
min-height: 60px;
background-position: padding-left:5px 50%;
}
* html .topiclist dl.icon {
height: 60px;
}
ul.topics dt,ul.topics dd.dterm {
padding-left: 130px;
}
ul.pmlist dt {
padding-left: 130px;
}
.row dl.icon dt , .row dl.icon dd.dterm {background-position: 70px 50%; min-height: 60px; height: auto !important}


dl.codebox{
background-color:#6E6868;
}

dl.codebox code {
color: #FFFFFF;
    }
        .postprofile img{margin-bottom: 10px;}       



        .h3 {
            color: white;
        }


        .left-box.h3 {
            color: white;
        }

 
                .content h2, .panel h2 {
        color:white;
        }


        fieldset dl:hover dt label{color:white;}

La liste des titres des messages est bien décalée, donc le CSS doit agir à ce niveau .
J' aimerais que les icônes se placent dans l' espace vide prévu, comme pour les sujets du forum .

Je pense avoir fourni tous les éléments nécessaires .

D' avance, MERCI Smile


Dernière édition par Albert (67) le Sam 22 Aoû 2015 - 16:34, édité 1 fois

Albert (67)
*****

Masculin
Messages : 756
Inscrit(e) le : 21/11/2007

http://forum.abkweb.fr/
Albert (67) a été remercié(e) par l'auteur de ce sujet.

Résolu Re: CSS / décaler les icônes de messages dans la messagerie

Message par Neptunia le Sam 22 Aoû 2015 - 13:06

Bonjour ^^

Le souci vient du fait que sur un sous-forum les icônes de sujet sont positionnées comme image d'arrière-plan (background) , alors que sur la messagerie elles sont en avant-plan

Essayez de remplacer :
Code:
ul.pmlist dt {
padding-left: 130px;
}
par
Code:
ul.pmlist dt {
padding-left: 130px;
}
ul.pmlist div img {
padding-left: 70px;
}

Il vous faudra peut-être ajuster le 70px pour parvenir à vos fins.

Neptunia
+ Hyperactif +

Féminin
Messages : 11005
Inscrit(e) le : 08/08/2010

http://www.planet-series.com/
Neptunia a été remercié(e) par l'auteur de ce sujet.

Résolu Re: CSS / décaler les icônes de messages dans la messagerie

Message par Albert (67) le Sam 22 Aoû 2015 - 14:24

Salut Neptune et merci

C' est un bon début . J' ai remplacé 70 par 45 et c' est bon .
Je ne comprend pas pourquoi 45px, alors que l' icône de sujet fait 50 .
Je pensais que la mesure se faisait à partir du début scratch
Dans les icône de sujet du forum, y' a 70 et c' est ce qui déplace vers la droite ...

Mais bon, si ça fonctionne c' est bon .

Reste le problème de la hauteur : centrer dans la hauteur ( à peu près )


Albert (67)
*****

Masculin
Messages : 756
Inscrit(e) le : 21/11/2007

http://forum.abkweb.fr/
Albert (67) a été remercié(e) par l'auteur de ce sujet.

Résolu Re: CSS / décaler les icônes de messages dans la messagerie

Message par Neptunia le Sam 22 Aoû 2015 - 15:25

Essayez en remplaçant :
Code:
ul.pmlist div img {
padding-left: 45px;
}
par :
Code:
ul.pmlist div {
padding: 5px 0 0 45px !important;
}

Le 5px indique le décalage par rapport au haut, le premier 0 celui relatif à la droite, le second 0 est relatif au bas, enfin le 45 concerne le décalage par rapport au bord gauche.

Right Propriété padding sur Mozilla Developer Network

Neptunia
+ Hyperactif +

Féminin
Messages : 11005
Inscrit(e) le : 08/08/2010

http://www.planet-series.com/
Neptunia a été remercié(e) par l'auteur de ce sujet.

Résolu Re: CSS / décaler les icônes de messages dans la messagerie

Message par Albert (67) le Sam 22 Aoû 2015 - 16:32

Yeeeaaaaahhhhhhhhh !!!!!!!!!!!!!!!!!!!!!

Ça fonctionne ( avec ta dernière modif ) après avoir remis 70 à la place de 45 Smile



Merci beaucoup Neptune

Very Happy

Albert (67)
*****

Masculin
Messages : 756
Inscrit(e) le : 21/11/2007

http://forum.abkweb.fr/
Albert (67) a été remercié(e) par l'auteur de ce sujet.

Résolu Re: CSS / décaler les icônes de messages dans la messagerie

Message par Neptunia le Sam 22 Aoû 2015 - 16:46

La div comportait déjà un décalage.

D'où le chiffre de tout à l'heure inférieur à la largeur de l'image...
... et l'obligation de mettre le paramètre !important.

Neptunia
+ Hyperactif +

Féminin
Messages : 11005
Inscrit(e) le : 08/08/2010

http://www.planet-series.com/
Neptunia a été remercié(e) par l'auteur de ce sujet.

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


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