Bonjour
Je voudrais remplacer le float:right de .crayon-icones pour que le
crayon s'affiche, coller à droite du texte à crayonner, sans être à
l'extrême droite comme avec le float:right
Je ne trouve pas la propriété css qui pourrait donner ce résultat.
Merci
RP
Le 31/07/2019 à 16:55, Renée Picard a écrit :
Bonjour
Je voudrais remplacer le float:right de .crayon-icones pour que le
crayon s'affiche, coller à droite du texte à crayonner, sans être à
l'extrême droite comme avec le float:rightJe ne trouve pas la propriété css qui pourrait donner ce résultat.
Merci
RP
Bonjour,
Ptet :
.crayon-icones {
float: right;
width: 20px;
text-align: right;
position: relative;
top: 0;
left: -50px; /*ou autre*/
...
Bonne journée,
Yves
_______________________________________________
liste spip
spip@rezo.net - désabonnement : envoyer un mail à spip-off@rezo.netArchives : https://www.mail-archive.com/spip@rezo.net/maillist.html
Infos : https://listes.rezo.net/mailman/listinfo/spip
Documentation de SPIP : http://www.spip.net/
Irc : de l'aide à toute heure : http://spip.net/irc
Merci pour la solution proposée mais ce n'est pas ce que je cherche.
Par exemple si j'utilise crayons sur un titre, si le titre est court, le
crayon apparait juste à droite, à côté de la dernière lettre.
De même si le titre est très long.
Donc le crayon n'aurait pas une position fixe mais s'ajusterait à la
longueur du texte.
Je cherche une propriété css qui pourrait faire cela.
Le 19-07-31 à 11:30, Yves_forums a écrit :
float: right;
width: 20px;
text-align: right;
position: relative;
top: 0;
left: -50px;
Je tenterais :
float: none;
display: inline-block;
Le 31/07/2019 à 17:39, Renée Picard a écrit :
Merci pour la solution proposée mais ce n'est pas ce que je cherche.
Par exemple si j'utilise crayons sur un titre, si le titre est court, le
crayon apparait juste à droite, à côté de la dernière lettre.
De même si le titre est très long.
Donc le crayon n'aurait pas une position fixe mais s'ajusterait à la
longueur du texte.
Je cherche une propriété css qui pourrait faire cela.
Nope, en fait ça ne semble pas possible.
L'icône est insérée dans le HTML *avant* le texte à éditer, donc
impossible de la placer à droite en CSS sans la mettre en float.
Le 31/07/2019 à 18:41, tcharlss a écrit :
Je tenterais :
float: none;
display: inline-block;Le 31/07/2019 à 17:39, Renée Picard a écrit :
Merci pour la solution proposée mais ce n'est pas ce que je cherche.
Par exemple si j'utilise crayons sur un titre, si le titre est court, le
crayon apparait juste à droite, à côté de la dernière lettre.
De même si le titre est très long.
Donc le crayon n'aurait pas une position fixe mais s'ajusterait à la
longueur du texte.
Je cherche une propriété css qui pourrait faire cela.
Bonjour,
Une solution, qui n'est pas applicable à tous les cas, est flexbox, par exemple sur un titre h1 :
h1 {
display: flex;
flex-direction: row-reverse;
justify-content: left;
}
françois
Le 31/07/2019 à 18:55, tcharlss a écrit :
Nope, en fait ça ne semble pas possible.
L'icône est insérée dans le HTML *avant* le texte à éditer, donc
impossible de la placer à droite en CSS sans la mettre en float.Le 31/07/2019 à 18:41, tcharlss a écrit :
Je tenterais :
float: none;
display: inline-block;Le 31/07/2019 à 17:39, Renée Picard a écrit :
Merci pour la solution proposée mais ce n'est pas ce que je cherche.
Par exemple si j'utilise crayons sur un titre, si le titre est court, le
crayon apparait juste à droite, à côté de la dernière lettre.
De même si le titre est très long.
Donc le crayon n'aurait pas une position fixe mais s'ajusterait à la
longueur du texte.
Je cherche une propriété css qui pourrait faire cela.
Le 01/08/2019 à 10:24, Graphie a écrit :
Bonjour,
Une solution, qui n'est pas applicable à tous les cas, est flexbox, par
exemple sur un titre h1 :
h1 {
display: flex;
flex-direction: row-reverse;
justify-content: left;
}françois
Ah oui bien vu, le conteneur ayant une classe .crayon ça doit être
jouable dans certains cas.
J'ai essayé avec le flexbox et je n'ai pas réussi.
Le 19-08-01 à 15:10, tcharlss a écrit :
Le 01/08/2019 à 10:24, Graphie a écrit :
Bonjour,
Une solution, qui n'est pas applicable à tous les cas, est flexbox, par
exemple sur un titre h1 :
h1 {
display: flex;
flex-direction: row-reverse;
justify-content: left;
}
françois
Ah oui bien vu, le conteneur ayant une classe .crayon ça doit être
jouable dans certains cas.
_______________________________________________
liste spip
spip@rezo.net<mailto:spip@rezo.net> - désabonnement : envoyer un mail à spip-off@rezo.net<mailto:spip-off@rezo.net>
Archives : https://www.mail-archive.com/spip@rezo.net/maillist.html
Infos : https://listes.rezo.net/mailman/listinfo/spip
Documentation de SPIP : http://www.spip.net/
Irc : de l'aide à toute heure : http://spip.net/irc
Préalablement, faire un test avec le débugger (F12) du navigateur.
Il faut peut-être "forcer" le display :
display: flex!important;
françois
Le 01/08/2019 à 21:16, Renée Picard a écrit :
J'ai essayé avec le flexbox et je n'ai pas réussi.
Le 19-08-01 à 15:10, tcharlss a écrit :Le 01/08/2019 à 10:24, Graphie a écrit :
Bonjour,
Une solution, qui n'est pas applicable à tous les cas, est flexbox, par
exemple sur un titre h1 :
h1 {
display: flex;
flex-direction: row-reverse;
justify-content: left;
}françois
Ah oui bien vu, le conteneur ayant une classe .crayon ça doit être
jouable dans certains cas._______________________________________________
liste spip
spip@rezo.net - désabonnement : envoyer un mail à spip-off@rezo.netArchives : https://www.mail-archive.com/spip@rezo.net/maillist.html
Infos : https://listes.rezo.net/mailman/listinfo/spip
Documentation de SPIP : http://www.spip.net/
Irc : de l'aide à toute heure : http://spip.net/irc
Merci
J'ai contourné les difficultés en plaçant le crayon à gauche.
.crayon-icones { float: left; text-align: center; position: relative;
top:0; margin-left: -19px; z-index:4999;vertical-align: middle; }
.crayon-icones span,.crayon-icones em { position:absolute; left:0; }
Le 19-08-02 à 01:56, Graphie a écrit :
Préalablement, faire un test avec le débugger (F12) du navigateur.
Il faut peut-être "forcer" le display :
display: flex!important;françois
Le 01/08/2019 à 21:16, Renée Picard a écrit :
J'ai essayé avec le flexbox et je n'ai pas réussi.
Le 19-08-01 à 15:10, tcharlss a écrit :Le 01/08/2019 à 10:24, Graphie a écrit :
Bonjour,
Une solution, qui n'est pas applicable à tous les cas, est flexbox,
par
exemple sur un titre h1 :
h1 {
display: flex;
flex-direction: row-reverse;
justify-content: left;
}françois
Ah oui bien vu, le conteneur ayant une classe .crayon ça doit être
jouable dans certains cas._______________________________________________
liste spip
spip@rezo.net - désabonnement : envoyer un mail à spip-off@rezo.netArchives : https://www.mail-archive.com/spip@rezo.net/maillist.html
Infos : https://listes.rezo.net/mailman/listinfo/spip
Documentation de SPIP : http://www.spip.net/
Irc : de l'aide à toute heure : http://spip.net/irc
_______________________________________________
liste spip
spip@rezo.net - désabonnement : envoyer un mail à spip-off@rezo.netArchives : https://www.mail-archive.com/spip@rezo.net/maillist.html
Infos : https://listes.rezo.net/mailman/listinfo/spip
Documentation de SPIP : http://www.spip.net/
Irc : de l'aide à toute heure : http://spip.net/irc
.