[PHPBB2] Redimension de l'avatar sur l'index

Coucou Lily,

tu déposes une div sur ton message alors que tu utilises un span sur ton forum?????
Bref, oui il faut redimensionner l'image et non la balise parent  .
Comme tu l'as fais avec ce style, mais la valeur 40 serait mieux avec la même valeur que le max-height, c'est à dire 50:

Code:


.vava_pa img {
    max-width: 40px !important;
    max-height: 50px !important;
}

Ensuite il faut placer les éléments ayant une position fixed avec un right et non avec
un margin-left Lily:

Ton margin-top n'est pas non plus +50px, cela n'existe pas :

Idem:

Code:

text-transform: italic;

Mais:

Code:

font-style: italic;

Code:

-moz-border-radius: 10px;

Mais si tu veux une bordure totalement ronde:

Code:

border-radius: 100%;

Sinon pour une bordure légèrement arrondie:

Code:

border-radius: 16px;

J'ai corrigé la c.s.s  l'avatar et le bienvenu:

Code:

.vava_pa {
 height: 50px !important;
 width: 50px !important;
 position: fixed;
 margin-top: 50px;
 border: 2px solid #147878;
 border-radius: 100%;
        text-align: center;
 right: 16%;
}

.bienvenue_pa {
 position: fixed;
 margin-top: 50px;
 font-family: Cookie;
 font-size: 25px;
 font-style: italic;
 color: #147878;
 right: 10%;
}
.vava_pa img {
 max-width: 50px !important;
 max-height: 50px !important;
}


Coucou Phil,

oulala je suis vraiment pas douée en code XD Pour le span, je voulais le texte et le vava l'un à côté de l'autre (et avec la div ça direct à la ligne, et pas le span, du coup j'avais essayé comme ça XD). Et j'ai oublié de rechanger quand j'ai vu que ça fonctionnait pas de cette manière XD

Merci pour la correction

J'arrive pas à comprendre pourquoi ça rend pas pareil sur les deux écrans ? C'est à cause de la résolution ?

Merci en tout cas

Re Lily,

Tu as encore changé le code html chère amie, difficile de suivre dans ce cas.....

Ton code html doit ressembler à ceci:

Code:


<table><tbody><tr><td><div class="vava_pa">[AVATAR]</div></td><td> <div class="bienvenue_pa">Bienvenue <br>[USERNAME] </div></td></tr></tbody></table>


Le code html complet aurait dû être mentionné....   .

Alors, si tu remplaces par ce code HTML:

Code:

<div class="bloc"><div class="vava_pa">[AVATAR]</div> <span class="bienvenue_pa">Bienvenue [USERNAME]</span></div>

Et que tu remplaces la css par celle-ci:

Code:


.bloc
{
  position: fixed;
margin-top: 50px;
  right: 5%;
  min-width: 350px;
  display: inline-flex;
  z-index:999;
}
.vava_pa {
    height: 50px !important;
    width: 50px !important;

    border: 2px solid #147878;
    border-radius: 100%;
    text-align: center;
   
}
.vava_pa img {
    max-width: 50px !important;
    max-height: 50px !important;
    border-radius: 100%;
}
.bienvenue_pa {
 

    font-family: Cookie;
    font-size: 25px;
    font-style: italic;
    color: #147878;
  margin: 10px 0px 10px 5px;

}



J'arrive pas à comprendre pourquoi ça rend pas pareil sur les deux écrans ? C'est à cause de la résolution ?

Ensuite je ne vois rien sur ta deuxième capture , c'est ce que tu veux mentionner ???

Re Phil =)

Oui j'ai changé le right, parce que le texte était superposé à l'avatar, du coup j'ai décalé. Je veux que l'avatar et le texte soit sous le bouton notification (comme sur ma première image).
Et du coup j'ai remis une div sur le template (plutôt que le span).

Code:

 <table><tr><td><div class="vava_pa">[AVATAR]</div></td><td> <div class="bienvenue_pa">Bienvenue <br/>
    [USERNAME] </div></td></tr></table>

C'est ça que j'ai maintenant (:
promis je change plus rien...
j'aime bien bidouiller en fait surtout quand je réussi à faire un truc XD


Et pour le souci de la seconde image, l'avatar et le texte sont au milieu du header (ça se voit pas bien parce qu'il est petit mais y'a un mini point rouge au milieu du bleu)
Et ce que je comprends pas c'est cet immense décalage entre les deux écrans, le miens ou l'avatar est placé à droite et celui de ma pote ou l'avatar est au milieu de la bannière.. Et y'a pas que sur mon fow que ça fait ça. Sur le sien aussi, on n'a pas les images au même endroit. Alors que chez moi c'est tout serré, chez elle tout est éloigné.. bref; on comprend pas bien le phénomène XD


Merci

Je viens d'éditer mon message Lily,
on voit cela après alors

Mon fofo de tests:

https://testdesforums.1fr1.net/

Merci Merci Merci


Je voudrais le tout sous le bouton des notif' (bon là je pense qu'il faut que je joue sur le % du right)

Pour ma pote, ça donne ça


Là c'est à peu près pareil mais la bannière chez elle fait minuscule comparé au reste.

Et on constate le même souci, sur son fow à elle
Ou elle, elle voit ça :

Et moi, ça


Ça nous laisse perplexe... et on se demande si c'est pas un souci de résolution d'écran...

Hello Lily,

Je voudrais le tout sous le bouton des notif' (bon là je pense qu'il faut que je joue sur le % du right)

Il faut jouer avec la div ayant la class bloc, comme ceci:

Code:

.bloc
{
position: fixed;
right: 0%;
display: inline-flex;
z-index: 999;
top: 30px;
width: auto;
padding: 2px;
}


Tu as combien de copines avec un visuel de fofo différent Lily .

Alors,il faut vider le cache du navigateur car on travaille en pourcentage sur le placement.
Donc aucun soucis de ce côté.

Merci pour l’explication. Ça marche parfaitement

Code:

 <table><tr><td><div class="vava_pa">[AVATAR]</div></td><td> <div class="bienvenue_pa">Bienvenue <br/>
        [USERNAME] </div></td></tr></table>

C'est ça que j'ai sous les notif'


Ils sont deux à ne pas avoir le même visuel et on comprend franchement pas pourquoi T-T

Le cache Lily tout simplement comme mentionné plus haut.

Par contre ajoutes une valeur 1 au right :

Code:

.bloc
{
position: fixed;
right: 1%;
display: inline-flex;
z-index: 999;
top: 30px;
width: auto;
padding: 2px;
}

Car c'est trop collé sur la droite.

OK merci beaucoup pour ton aide

Comment on vide le cache ? J'ai jamais fait ça en fait XD

De rien ,

regarde ici:
https://www.commentcamarche.net/securite/confidentialite/747-effacer-l-historique-ou-le-cache-d-un-navigateur-web/

Merci pour ton aide précieuse

Je mets le sujet en résolu

De rien Lily,