Я попытался выровнять нижний левый край текста по верхнему левому краю изображения в центре. Самый большой улов в том, что я не хочу влиять на вертикальное и горизонтальное центрирование изображения. Снимок экрана моего текущего вида
JSFiddle
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="_css/bootstrap.css">
<link rel="stylesheet" href="_css/body.css">
<link href="https://use.typekit.net/zxa6xyn.css" rel="stylesheet">
<title>Temple Creative | Designing Your Visual Identity</title>
</head>
<body background="images/background.jpg" class="bg" style="height: 100vh">
<div class="row d-flex flex-row no-gutters" style="height: 100vh">
<div class="col-1 my-auto">
<ul class="navlinks">
<li id="this"><span>home</span></li>
<li><a href="about.html"><img src="images/aboutlogo.png" alt="aboutlogo"
class="menulogo" style="width: 25%"><span class="navlinkitem">aBout</span></a></li>
<li><a href="services.html"><img src="images/servlogo.png" alt="servlogo"
class="menulogo" style="width: 25%"><span class="navlinkitem">services</span></a></li>
<li><a href="portfolio.html"><img src="images/portlogo.png" alt="portlogo"
class="menulogo" style="width: 25%"><span class="navlinkitem">Portfolio</span></a></li>
<li><a href="contact.html"><img src="images/contactlogo.png"
alt="contactlogo" class="menulogo" style="width: 25%"><span
class="navlinkitem">contact</span></a></li>
</ul>
</div>
<p id="dmserv">Align left edge of text on top of and to left edge of center logo</p>
<img src="images/largelogo.png" alt="mainLogo" id="lgLogo" class="image-fluid
mx-auto my-auto" width="50%"
data-tilt-full-page-listening data-tilt data-tilt-reverse="true">
<script src="_scripts/vanilla-tilt.js"></script>
<div class="d-flex flex-column col-1 my-auto">
<a href="http://www.facebook.com/templecreative" target="_blank"><img
src="images/fbLogo-01.png" alt="facebook" id="facebook" class="social image-fluid"
style="width:100%"></a>
<a href="http://www.instagram.com/temple.creative" target="_blank"><img
src="images/igLogo-01.png" alt="instagram" id="instagram" class="social image-fluid"
style="width:100%"></a>
</div>
</div>
<!--Javascript-->
<script src="_scripts/jquery.js"></script>
<script src="_scripts/bootstrap.js"></script>
</body>
</html>