Bonjour,

Je suis débutant en css. J'utilise Hugo pour générer un blog et j'utilise un thème déjà fait.

Mais je souhaite ajouter une petite image/icône à la suite du titre de mon blog et je n'arrive pas à l'aligner.

Nom : screenshot_2021-09-20-23:16:05.png
Affichages : 151
Taille : 14,3 Ko

Je souhaite donc mettre ce petit béret sur la même ligne que "Mon blog"

Actuellement voilà ce que j'ai :

Dans le head.html :
Code html : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
<div class="header">
	<base href="{{ .Site.BaseURL }}">
	<h1 class="site-title">
<img src="{{ "icons/icon.png" | absURL }}" width="40" height="40" ><a href="{{ .Site.BaseURL }}">{{ .Site.Title }}</a></h1>
	<div class="site-description">
		{{- if isset .Site.Params "subtitle" -}}
		<h2>{{ .Site.Params.Subtitle | markdownify }}</h2>
		{{- end -}}
		<nav class="nav social">
			<ul class="flat">
				{{- range $index, $key := .Site.Params.Social -}}
				<a href="{{ $key.url }}" title="{{ $key.name }}"><i data-feather="{{ $key.icon }}"></i></a>
				{{- end -}}
			</ul>
		</nav>
	</div>
 
	<nav class="nav">
		<ul class="flat">
			{{ range .Site.Menus.main }}
			<li>
				<a href="{{ .URL }}">{{ .Name }}</a>
			</li>
			{{ end }}
		</ul>
	</nav>
</div>

img src="{{ "icons/icon.png" | absURL }}" width="40" height="40" > , ci-dessus, appelle l'image du béret.

Dans mon main.css j'ai cette partie qui doit correspondre je pense :
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
.site-title a {
	color: #000000;
	text-decoration: none !important;
}
Comment puis-je faire ? Merci des conseils ou des pistes me permettant d'y arriver.