Positionierung eines divs im #header in wordpress

  • Liebe CSS-Gemeinde,


    ich habe ein, meiner Meinung nach, extrem simples Problem, komme aber nicht weiter.


    Ich administriere eine Wordpressseite (prosanova.net). Hierbei möchte ich ein div-Element in der #header class .hgroup positionieren. Ich hab die div class .hsocial genannt, es beinhaltet das social-widget der Seite. Also kleine Buttons für Social Media Links. Sie ist derzeit über dem Seitenlogo positioniert, welches sich im center des headers befindet. Ich möchte die div class .hsocial jetzt nach rechts oben verschieben. Komme aber nicht weiter. Ich habs schon über jegliche position-tags versucht. Aber ich schaffs lediglich das div-Element nach links oder rechts zu verschieben, aber quasi nicht top-right.


    Hier ist der CSS-Code aus dem Eltern-Theme für den Header:

    CSS
    1. /************************************************************************************HEADER*************************************************************************************/#headerwrap { width: 100%; background-color: #000; background-image: url("images/header.jpg"); background-position: 50% -10px; background-repeat: no-repeat; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;z-index: 100 !important;}
    2. #headerwrap.header-gallery,#headerwrap[data-bg],#headerwrap[data-fullwidthvideo] { background-image: none; background-position: none;}
    3. #header { display: table; /* vertical align trick */ table-layout: fixed; width: 100%; height: 500px; text-align: center; position: relative;}
    4. #header .hgroup { display: table-cell; /* vertical align trick */ vertical-align: middle; width: 100%; max-width: 100%; color: #fff; position: relative;}
    5. .home #headerwrap,.home #header { height: 100vh;}




    Hat jemand eine Idee, wie ich jetzt das div-Element hsocial nach top-right bekomme?
    Danke für eure Hilfe!

  • Wenn man den Code erst noch lesbar machen muss, sinkt die Motivation auf den Nullpunkt.
    Also, Zeilen untereinander statt nebeneinander, und dann vielleicht noch in die passenden Code-Tags eingebunden, könnte Heerscharen an Helfern motivieren ;)