How to render social icons at header?

[veerendra2]

Hello,
I'm new to hugo and not web dev. I want to put my social icons at header like this blog https://blog.jessfraz.com/. So far I tried pasting below code at https://github.com/adityatelange/hugo-PaperMod/blob/master/layouts/partials/header.html#L121(after div and before {{- $currentPage := . }})

        <div class="social-icons">
            {{- range .Site.Params.socialIcons }}
            <a href="{{ trim .url " " }}" target="_blank" rel="noopener noreferrer me" title="{{ .name | title }}">
                {{ partial "svg.html" . }}
            </a>
            {{- end }}
        </div>
        {{- $currentPage := . }}

But it seems try to render at vertically(in single cell?) like below screenshot.

How to render social icons horizontally and next to menu in header.

Thanks