From 1729f1daeb0f36c172c1bc94c9cb25bffa2fc292 Mon Sep 17 00:00:00 2001 From: Yax <1949284+kianby@users.noreply.github.com> Date: Fri, 2 Feb 2024 18:02:03 +0100 Subject: [PATCH] Fix broken images: replace HTML with Markdown --- .../2011-06-04-personnalisation-de-gnome-3.md | 4 +--- .../2012-01-08-installation-de-jenkins-ci.md | 7 +++---- posts/2012/2012-07-13-ranger-son-cartable.md | 3 +-- .../2012/2012-12-31-bilan-de-l-annee-2012.md | 4 +--- posts/2014/2014-01-02-horde-debian.md | 14 +++++++------- posts/2014/2014-08-05-vacances.md | 2 +- posts/2014/2014-08-07-pecosys.md | 18 +++++++++--------- posts/2014/2014-08-12-qemu-raspbian.md | 8 ++------ posts/2015/2015-04-30-back-to-roots-bash.md | 4 +--- .../2015/2015-09-23-obsolescence-repoussee.md | 3 +-- ...15-12-12-retour-experience-ubuntu-touch.md | 19 +++++++++---------- .../2017/2017-02-24-termux-pour-quoi-faire.md | 4 +--- posts/2018/2018-02-07-quel-systeme-serveur.md | 4 ++-- static/css/style.css | 15 +++++++++++++++ static/css/style.min.css | 3 +-- 15 files changed, 55 insertions(+), 57 deletions(-) diff --git a/posts/2011/2011-06-04-personnalisation-de-gnome-3.md b/posts/2011/2011-06-04-personnalisation-de-gnome-3.md index a889185..5fc4118 100755 --- a/posts/2011/2011-06-04-personnalisation-de-gnome-3.md +++ b/posts/2011/2011-06-04-personnalisation-de-gnome-3.md @@ -15,9 +15,7 @@ L'auteur va très loin, du rajout d'un menu d'application discret sur le panel au déplacement des icônes de la systray vers le panel... exactement ce que je cherchais pour ne plus rater les notifications de Choqok, Empathy et Dropbox. - [déplacer les apps systray
-vers le panel -](/images/04x/systray2panel.jpg) + ![déplacer les apps systray vers le panel](/images/04x/systray2panel.jpg#center) Je vous conseille aussi la lecture des trucs et astuces Gnome 3 parus sur [Tux- Planet](http://www.tux-planet.fr/toutes-les-astuces-pour-gnome-shell/) et la diff --git a/posts/2012/2012-01-08-installation-de-jenkins-ci.md b/posts/2012/2012-01-08-installation-de-jenkins-ci.md index 6ce9905..04535c3 100755 --- a/posts/2012/2012-01-08-installation-de-jenkins-ci.md +++ b/posts/2012/2012-01-08-installation-de-jenkins-ci.md @@ -2,8 +2,7 @@ -Jenkins CI L'intégration +![Jenkins CI](/images/06x/jenkins-logo.png#left) L'intégration continue s'inscrit dans [la méthodologie Agile](http://fr.wikipedia.org/wiki/M%C3%A9thode_agile) ; Son objectif est de garantir que le projet est stable tout au long du développement et qu'on peut @@ -39,8 +38,8 @@ secondes. Sinon démarrez Tomcat : sudo /etc/init.d/tomcat6 start ``` -Jenkins est accessible ici : [http://<nom du -serveur>:8080/jenkins](http://localhost:8080/jenkins) +Jenkins est accessible ici : [http://nom du +serveur:8080/jenkins](http://localhost:8080/jenkins) Par défaut la sécurité n'est pas activée et tout le monde peut accéder et administrer Jenkins. Nous allons remédier à cela en modifiant les paramètres diff --git a/posts/2012/2012-07-13-ranger-son-cartable.md b/posts/2012/2012-07-13-ranger-son-cartable.md index 3c49694..166d0d3 100755 --- a/posts/2012/2012-07-13-ranger-son-cartable.md +++ b/posts/2012/2012-07-13-ranger-son-cartable.md @@ -12,8 +12,7 @@ langage et la qualité du rendu en PDF avec pdflatex. J'ai décidé de continuer sur la même voie, avec l'objectif de produire une mise en page moins austère à défaut de pouvoir rajeunir le candidat ;-) - CV
-de Jean Code En cherchant des idées +![CV de Jean Code](/images/06x/trollface_cv.png#left) En cherchant des idées de mise en forme j'ai découvert [moderncv](http://www.ctan.org/pkg/moderncv), une classe de document LaTeX qui permet de structurer le document par des commandes supplémentaires (définir les données personnelles, définir une diff --git a/posts/2012/2012-12-31-bilan-de-l-annee-2012.md b/posts/2012/2012-12-31-bilan-de-l-annee-2012.md index f905c0e..5f1beae 100755 --- a/posts/2012/2012-12-31-bilan-de-l-annee-2012.md +++ b/posts/2012/2012-12-31-bilan-de-l-annee-2012.md @@ -11,9 +11,7 @@ intégré une nouvelle société avec une double casquette développeur Java / admin système GNU/Linux qui m'amène à mettre en place des solutions de Haute Disponibilité. - Sinon ma belle découverte de l'année c'est Fedora que j'utilise au travail et -à la maison depuis 6 mois. Alors que j'ai surtout utilisé des distributions +![31-dec-calendrier](/images/07x/calendar.png#left) Sinon ma belle découverte de l'année c'est Fedora que j'utilise au travail et à la maison depuis 6 mois. Alors que j'ai surtout utilisé des distributions basées sur Debian hormis ArchLinux par le passé, j'ai été enchanté par le spin XFCE de Fedora 17. Mon portable relativement récent est correctement géré *"out of the box"*, les dépôts Fedora sont plutôt complets et diff --git a/posts/2014/2014-01-02-horde-debian.md b/posts/2014/2014-01-02-horde-debian.md index a65ad21..1c95a86 100755 --- a/posts/2014/2014-01-02-horde-debian.md +++ b/posts/2014/2014-01-02-horde-debian.md @@ -22,7 +22,7 @@ Côté ordinateur, Lightning supporte nativement le protocole CalDav et le carne d'adresse peut être synchronisé avec CardDAV en installant le [module complémentaire pour Sogo](http://www.sogo.nu/english/downloads/frontends.html). -A +![logo horde](/images/2014/logo-horde.jpg#left) A l'époque de mon Motorola Droid, j'avais déjà utilisé le client Funambol pour synchroniser mes données avec [eGroupware](http://www.egroupware.org/community_edition) et je m'étais @@ -144,31 +144,31 @@ en tant qu'administrateur sans mot de passe. 1. Aller dans le menu Administration / Configuration - +![horde config](/images/2014/horde-config.png#center) 2. Cliquer sur le composant Horde (horde) - +![horde application](/images/2014/horde-application.png#center) 3. Configurer la base de donnée dans l'onglet Database - +![horde database](/images/2014/horde-database.png#center) #### 2ème étape : créer un utilisateur avec les droits d'administration. 1. Aller dans le menu Administration / Utilisateur - +![horde user](/images/2014/horde-user.png#center) 2. Créer un nouvel utilisateur - +![horde adduser](/images/2014/horde-adduser.png#center) 3. Retourner dans le menu Administration / Configuration et rajouter l'utilisateur nouvellement créé dans les admins de l'onglet Authentification. - +![horde setadmin](/images/2014/horde-setadmin.png#center) 4. Il est conseillé de tester le nouvel utilisateur en se déconnectant et en se reconnectant. Si cela fonctionne, on peut enlever l'utilisateur diff --git a/posts/2014/2014-08-05-vacances.md b/posts/2014/2014-08-05-vacances.md index 1811321..a1bb125 100755 --- a/posts/2014/2014-08-05-vacances.md +++ b/posts/2014/2014-08-05-vacances.md @@ -20,4 +20,4 @@ Pour me relaxer, j'ai travaillé un peu la cosmétique du site : Bon été à tous - \ No newline at end of file +![apero](/images/2014/apero.jpg) \ No newline at end of file diff --git a/posts/2014/2014-08-07-pecosys.md b/posts/2014/2014-08-07-pecosys.md index 1b6c69b..43a364d 100755 --- a/posts/2014/2014-08-07-pecosys.md +++ b/posts/2014/2014-08-07-pecosys.md @@ -40,8 +40,8 @@ s'installe en 5 minutes ? Cela dépend de tout un chacun mais j'y suis venu pour les raisons suivantes : -- Les articles sont écrits dans un format simpliste (pour ma part c'est Markdown), la présentation est clairement séparée du contenu. C'est lors du build qu'on génère le code HTML en fonction de *templates* et de CSS personnalisés par nos soins. Le code HTML généré par Pelican est propre et léger. Le jour où j'ai migré de WordPress à PluXml, j'ai été horrifié par le code HTML de WordPress. -- Le contenu du blog est un ensemble de fichier au format texte, idéal à gérer avec un gestionnaire de sources afin de garder trace des modifications. Un gestionnaire de sources devient aussi un moyen d'automatiser la mise à jour du site. On écrit et on teste sur sa machine de dev, on publie sous GIT et il suffit que le serveur rafraîchisse sa version du site quand une modification a été effectuée. +- Les articles sont écrits dans un format simpliste (pour ma part c'est Markdown), la présentation est clairement séparée du contenu. C'est lors du build qu'on génère le code HTML en fonction de *templates* et de CSS personnalisés par nos soins. Le code HTML généré par Pelican est propre et léger. Le jour où j'ai migré de WordPress à PluXml, j'ai été horrifié par le code HTML de WordPress. +- Le contenu du blog est un ensemble de fichier au format texte, idéal à gérer avec un gestionnaire de sources afin de garder trace des modifications. Un gestionnaire de sources devient aussi un moyen d'automatiser la mise à jour du site. On écrit et on teste sur sa machine de dev, on publie sous GIT et il suffit que le serveur rafraîchisse sa version du site quand une modification a été effectuée. #### La problématique des commentaires @@ -79,9 +79,9 @@ La sauvegarde se fait grâce à GIT. Ah j'avais pas encore parlé de GIT :-) On Donc, pour résumer : -- j'écris mes articles sur ma machine de dev perso, je publie dans GIT et je pousse mes modifications au GIT centralisé de BitBucket (au sens GIT: ORIGIN). -- mon serveur vérifie périodiquement si le dépôt BitBucket a été modifié et si c'est le cas, il rapatrie les sources du blog et reconstruit le site grâce à sa mécanique Pelican installée localement. -- Pecosys a sa propre version du blog (au sens GIT: CLONE) maintenue à jour de BitBucket. +- j'écris mes articles sur ma machine de dev perso, je publie dans GIT et je pousse mes modifications au GIT centralisé de BitBucket (au sens GIT: ORIGIN). +- mon serveur vérifie périodiquement si le dépôt BitBucket a été modifié et si c'est le cas, il rapatrie les sources du blog et reconstruit le site grâce à sa mécanique Pelican installée localement. +- Pecosys a sa propre version du blog (au sens GIT: CLONE) maintenue à jour de BitBucket. Donc quand Pecosys reçoit un nouveau commentaire, il met à jour sa version du blog (la branche MASTER) et il crée une nouvelle branche XYZ pour ce @@ -101,8 +101,8 @@ signifie qu'on refuse le commentaire. En fonction de cette réponse, le serveur Pecosys qui vérifie sa boite de réception régulièrement, va traiter le commentaire : -- un refus du commentaire revient à supprimer la branche GIT XYZ -- une approbation du commentaire ramène les modifications de la branche XYZ sur la branche MASTER (au sens GIT: MERGE) et pousse les modifications sur le GIT distant (dans mon cas BitBucket) +- un refus du commentaire revient à supprimer la branche GIT XYZ +- une approbation du commentaire ramène les modifications de la branche XYZ sur la branche MASTER (au sens GIT: MERGE) et pousse les modifications sur le GIT distant (dans mon cas BitBucket) Dans les deux cas, un email de confirmation de l'action réalisée est envoyé à l'administrateur du blog. @@ -113,7 +113,7 @@ publier le commentaire. Si vous avez bien suivi et je sais que c'est un peu touffu et compliqué, vous vous demandez comment les commentaires (ces fichiers en Markdown) sont générés -en HTML. Et bien, pas le biais d'un plugin Pelican nommé **CaCause**, en +en HTML. Et bien, par le biais d'un plugin Pelican nommé **CaCause**, en hommage au projet de base initié il y a un an avec [Bruno Adele](http://www.jesuislibre.org) et [Nahir Mohamed](https://github.com/nadley) dont Pecosys est une reprise des idées @@ -127,4 +127,4 @@ qui contient donc mes *templates* avec le formulaire et les sources du plugin. En attendant je retourne à mon farniente estival :-) - +![lemon](/images/2014/lemon.jpg) diff --git a/posts/2014/2014-08-12-qemu-raspbian.md b/posts/2014/2014-08-12-qemu-raspbian.md index a8af43f..691b58b 100755 --- a/posts/2014/2014-08-12-qemu-raspbian.md +++ b/posts/2014/2014-08-12-qemu-raspbian.md @@ -2,13 +2,9 @@ -Raspberry logoJe m'intéresse de plus en plus au Raspberry et je -franchirai peut-être le pas de l'achat dans quelque temps. J'ai voulu voir à +![Raspberry logo](/images/2014/rasplogo.png#left) Je m'intéresse de plus en plus au Raspberry et je franchirai peut-être le pas de l'achat dans quelque temps. J'ai voulu voir à quoi ressemble sa distribution principale Raspbian (basée sur Debian) en -l'émulant sous Qemu. Je me suis basé sur [le tutorial pointé par beaucoup de -gens dans les forums](http://xecdesign.com/qemu-emulating-raspberry-pi-the- -easy-way/) et j'ai effectué des recherches annexes pour résoudre +l'émulant sous Qemu. Je me suis basé sur [le tutorial pointé par beaucoup de gens dans les forums](http://xecdesign.com/qemu-emulating-raspberry-pi-the-easy-way/) et j'ai effectué des recherches annexes pour résoudre certains problèmes : taille des partitions, gestion de la souris sous Qemu. Ce qui suit est le résultat de mes manipulations pour émuler Raspbian avec Qemu depuis une distribution GNU/Linux 64 bits. diff --git a/posts/2015/2015-04-30-back-to-roots-bash.md b/posts/2015/2015-04-30-back-to-roots-bash.md index a6292ad..cb6b6c2 100755 --- a/posts/2015/2015-04-30-back-to-roots-bash.md +++ b/posts/2015/2015-04-30-back-to-roots-bash.md @@ -14,9 +14,7 @@ intéressant de personnaliser la configuration de son shell pour se l'approprier C'est *fun à réaliser* et cela donne envie de faire plus de choses depuis le terminal. -Un barbu Bon si dans quelques mois, les annonces de sortie du nouveau KDE ou -Gnome vous font ricaner, que vous ne jurez que par +![un barbu](/images/2015/stallman-code.jpg#right) Bon si dans quelques mois, les annonces de sortie du nouveau KDE ou Gnome vous font ricaner, que vous ne jurez que par [Awesome](http://awesome.naquadah.org), [Rxvt](http://sourceforge.net/projects/rxvt) et [Tmux](http://tmux.sourceforge.net), vous êtes au bout du chemin, peut-être un diff --git a/posts/2015/2015-09-23-obsolescence-repoussee.md b/posts/2015/2015-09-23-obsolescence-repoussee.md index 20ec364..b06ce81 100755 --- a/posts/2015/2015-09-23-obsolescence-repoussee.md +++ b/posts/2015/2015-09-23-obsolescence-repoussee.md @@ -22,8 +22,7 @@ la durée de vie du téléphone. L'équipe Ubuntu promet une mise à jour des téléphones sans intermédiaire tant que le matériel sera suffisamment puissant pour supporter les évolutions d'Ubuntu Touch. -poussiere Pour les PC, un coup de pouce peut rajeunir un matériel +![poussiere](/images/2015/poussiere.jpg#left) Pour les PC, un coup de pouce peut rajeunir un matériel vieillissant : une distribution GNU/Linux légère et l'investissement dans un SSD. J'ai profité des soldes de l'été pour acheter un SSD de 64 Go pour ma machine principale, un portable Toshiba de 2009 (processeur Core 2 Duo et 4 Go diff --git a/posts/2015/2015-12-12-retour-experience-ubuntu-touch.md b/posts/2015/2015-12-12-retour-experience-ubuntu-touch.md index 79039e1..9da5bfa 100755 --- a/posts/2015/2015-12-12-retour-experience-ubuntu-touch.md +++ b/posts/2015/2015-12-12-retour-experience-ubuntu-touch.md @@ -13,8 +13,7 @@ ont été commercialisés : deux modèles du constructeur espagnol BQ qui semble très appréciés par la communauté Ubuntu et un modèle assez puissant, le MX4 du constructeur chinois Meizu. -A proposCa commence donc par l'installation du système qui est assez +![A propos](/images/2015/ubuntu-about.png#left) Ca commence donc par l'installation du système qui est assez simple car d'une part le Nexus 4 a un booloader facile à déverrouiller et Ubuntu Touch est basé sur un Android, on utilise donc des outils Android (adb, fastreboot) pour flasher le système. Ensuite les outils Canonical @@ -49,30 +48,30 @@ je m'emballe, faisons d'abord un petit tour en images du système. **L'écran de déverrouillage et ses statistiques amusantes :** -ubuntu unlock +![ubuntu unlock](/images/2015/ubuntu-unlock1.png) -ubuntu unlock +![ubuntu unlock](/images/2015/ubuntu-unlock2.png) **L'écran principal avec ses applications en rang d'oignons:** -ubuntu application +![ubuntu application](/images/2015/ubuntu-appli1.png) -ubuntu application +![ubuntu application](/images/2015/ubuntu-appli2.png) **Les applications favorites sur la gauche en faisant glisser le bord gauche de l'écran** **et les applications lancées en faisant glisser le bord droit de l'écran :** -ubuntu unity +![ubuntu unity](/images/2015/ubuntu-unity.png) -ubuntu tasks +![ubuntu tasks](/images/2015/ubuntu-tasks.png) **Les paramètres système et un aperçu du magasin d'applications :** -ubuntu settings +![ubuntu settings](/images/2015/ubuntu-settings.png) -ubuntu store +![ubuntu store](/images/2015/ubuntu-store.png) A part la particularité du tirage des bords d'écran pour faire apparaître la barre latérale ou passer d'une application à l'autre mais on pige vite le coup, diff --git a/posts/2017/2017-02-24-termux-pour-quoi-faire.md b/posts/2017/2017-02-24-termux-pour-quoi-faire.md index bda7cc1..3bc386c 100755 --- a/posts/2017/2017-02-24-termux-pour-quoi-faire.md +++ b/posts/2017/2017-02-24-termux-pour-quoi-faire.md @@ -13,9 +13,7 @@ régulières. La série de Cascador décrit différents scénarios d'utilisation installer un serveur SSH, utiliser des outils console, accéder à des API Android. -termuxJ'ai bien mordu, jusqu'à me faire offrir un super clavier -bluetooth pour Noël (merci frérot). +![Clavier esynic](/images/2017/termux-esynic.jpg#left) J'ai bien mordu, jusqu'à me faire offrir un super clavier bluetooth pour Noël (merci frérot). Le risque était que le coup de coeur retombe ; qu'après avoir bien rigolé à installer **vim** et consorts, on s'essoufle à cause des diff --git a/posts/2018/2018-02-07-quel-systeme-serveur.md b/posts/2018/2018-02-07-quel-systeme-serveur.md index e8a61e8..6ffd248 100755 --- a/posts/2018/2018-02-07-quel-systeme-serveur.md +++ b/posts/2018/2018-02-07-quel-systeme-serveur.md @@ -17,7 +17,7 @@ nous sommes arrivés à **"le meilleur système c'est AUCUN"**. ### Phase 1 : le monolithe -![Monolithe](/images/2018/monolithe.jpg) +![Monolithe](/images/2018/monolithe.jpg#left) Le serveur est monolithique donc le choix du système d'exploitation est crucial. @@ -104,7 +104,7 @@ Bon j'ai l'air emballé sur Docker et c'est le cas, d'un point de vue professionnel. Ce n'est pas mon rêve pour mon auto-hébergement, les conteneurs ont tous la même taille, ça manque de diversité et de fun pour moi. -![Have Fun](/images/2018/havefun.jpg) +![Have Fun](/images/2018/havefun.jpg#left) La plupart des entreprises sont entre la phase 2 et la phase 3 : elle ont virtualisé tout ce qui est possible et elles migrent des services sous diff --git a/static/css/style.css b/static/css/style.css index 687bc04..07a41a7 100644 --- a/static/css/style.css +++ b/static/css/style.css @@ -154,3 +154,18 @@ footer { text-align: right; } +/* image placement (https://stackoverflow.com/questions/255170/markdown-and-image-alignment) */ +img[src*='#left'] { + float: left; + margin-left: 20px; + margin-right: 20px; +} +img[src*='#right'] { + float: right; + margin-left: 20px; + margin-right: 20px; +} +img[src*='#center'] { + display: block; + margin: auto; +} \ No newline at end of file diff --git a/static/css/style.min.css b/static/css/style.min.css index 47228e7..640d03d 100644 --- a/static/css/style.min.css +++ b/static/css/style.min.css @@ -1,2 +1 @@ -body{font-family:system-ui,sans-serif;background-color:#fbfefb}body,p{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}p,li{font-weight:400;font-size:large;line-height:28px;vertical-align:baseline;color:#384743;margin-bottom:2rem}h1,h2,h3,h4,h5,h6{color:#05bf85}h1{font-weight:400}a:link,a:visited{color:#006cac;text-decoration:none}li{margin-bottom:0}a:hover,a:active{color:#2e8b57}.banner div{background-image:url(/fond-resized.jpg);background-repeat:no-repeat;background-size:cover;background-position:center;width:100%;height:250px;line-height:13rem;text-align:center;vertical-align:middle;margin-bottom:5rem}.banner div>h1{color:#242e2b;vertical-align:baseline}.banner div>h2{font-weight:400;color:#384743;vertical-align:baseline}#menu-blog{font-weight:500;font-size:larger;line-height:96px;vertical-align:middle}#menu-blog a{padding-right:2rem}.post{margin-left:1rem;margin-right:1rem}.summary{margin-top:0}.article>h1{margin-bottom:0}.meta{margin-top:0;margin-bottom:0}.meta>span{display:inline;margin-right:1rem} -.meta-post{margin-top:0;margin-bottom:2.4rem}.meta-post>span{display:inline;margin-right:1rem}.hidden{display:none}#comment-form>form>fieldset>.remarque{display:none}.comment-separator{height:.1rem;background:#717171;border-bottom:.2rem solid #6e9cc7;margin-bottom:1rem}.comment-indicator{color:coral}.comment-author{font-weight:500}.comment-detail{margin-bottom:2.5rem}.comment-body{margin-left:4.2rem}footer{background:#f0f0f0;border-top:thin solid #e0e0e0;margin-left:2rem;margin-right:2rem;margin-top:2rem;padding:1rem 0;box-shadow:0 100vh 0 100vh #f0f0f0}.txtright{text-align:right} \ No newline at end of file +body{font-family:system-ui,sans-serif;background-color:#fbfefb}body,p{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}p,li{font-weight:400;font-size:large;line-height:28px;vertical-align:baseline;color:rgb(56,71,67);margin-bottom:2rem}h1,h2,h3,h4,h5,h6{color:#05bf85}h1{font-weight:400}a:link,a:visited{color:rgb(0,108,172);text-decoration:none}li{margin-bottom:0rem}a:hover,a:active{color:seagreen}.banner div{background-image:url(/fond-resized.jpg);background-repeat:no-repeat;background-size:cover;background-position:center;width:100%;height:250px;line-height:13rem;text-align:center;vertical-align:middle;margin-bottom:5rem}.banner div>h1{color:rgb(36,46,43);vertical-align:baseline}.banner div>h2{font-weight:400;color:rgb(56,71,67);vertical-align:baseline}#menu-blog{font-weight:500;font-size:larger;line-height:96px;vertical-align:middle}#menu-blog a{padding-right:2rem}.post{margin-left:1rem;margin-right:1rem}.summary{margin-top:0rem}.article>h1{margin-bottom:0rem}.meta{margin-top:0rem;margin-bottom:0rem}.meta>span{display:inline;margin-right:1rem}.meta-post{margin-top:0rem;margin-bottom:2.4rem}.meta-post>span{display:inline;margin-right:1rem}.hidden{display:none}#comment-form>form>fieldset>.remarque{display:none}.comment-separator{height:.1rem;background:#717171;border-bottom:.2rem solid #6E9CC7;margin-bottom:1rem}.comment-indicator{color:coral}.comment-author{font-weight:500}.comment-detail{margin-bottom:2.5rem}.comment-body{margin-left:4.2rem}footer{background:#f0f0f0;border-top:thin solid #e0e0e0;margin-left:2rem;margin-right:2rem;margin-top:2rem;padding:1rem 0;box-shadow:0 100vh 0 100vh #f0f0f0}.txtright{text-align:right}img[src*='#left']{float:left;margin-left:20px;margin-right:20px}img[src*='#right']{float:right;margin-left:20px;margin-right:20px}img[src*='#center']{display:block;margin:auto} \ No newline at end of file