Hallo liebe Community,
ich weiß leider nicht mehr weiter.
Ich möchte die Logos und den Titel zu Href vertikal zentrieren.
Aber ich schaffe es nicht.
Aktuell ist es so das die Elemente innterhalb von <p></p> vertikal wie folgt angeordnet sind:
*) Das Logo liegt vertikal oben
*) Der Text liegt vertikal unten.
HeaderInfo.png
HeaderInfo-NEU.png
Mein Code:
HTML-Code:
<div id="HINFO">
<div id="HMail">
<p><a href="mailto:office@test.at">office@test.at - <img src="assets/images/1/Logo_Mail.png" alt="EMail" width="20" height="20"></a></p>
</div>
<div id="HTel">
<p><a href="tel:+4301234567890">+43 (0) 123 456 789 0 - <img src="assets/images/0/Logo_Phone.png" alt="Telefon" width="20" height="20"></a></p>
</div>
<div id="HFace">
<p><a href="https://www.facebook.com/test/" target="_blank" rel="noopener">Besuchen Sie uns auch auf - <img src="assets/images/b/Logo_Facebook.png" alt="Facebook" width="20" height="20"></a></p>
</div>
<div id="GPlus">
<p><a href="https://plus.google.com/0001" target="_blank" rel="noopener">Folgen Sie uns auch auf - <img src="assets/images/8/Logo_GPlus.png" alt="Google Plus" width="20" height="20"></a></p>
</div>
</div>
PHP-Code:
...
#header #HINFO {
text-align:right;
justify-self: end;
align-self: center;
-ms-grid-row: 1;
-ms-grid-column: 2;
-ms-grid-column-align: end;
-ms-grid-row-align: center;
}
#header #HINFO p {
margin:0;
}
#header #HINFO a {
margin:0;
text-decoration:none;
}
#header #HLogo img {
height:100%;
text-decoration:underline;
}...
Lesezeichen