Has anyone done this for any external portal header, navbar left image?

so when the user clicks on the image, the home page of the website is displayed?

I know that it cannot be done via .css

yet, css classes control what appears in the header web template.

I am just not getting it figured out and Mr. Google has not shown me any examples of this.

not asking for a complete solution, but a pointer in the right direction if you have it. 

I am already bald but if I were not I would pulling my hair out! LOL

.navbar {
  background: url("pagebannerleftside.jpg");
  background-color:white;
  background-position: left;
  background-repeat: no-repeat;
  height: 110px;
 }

<div class="navbar navbar-static-top" role="navigation" >
  <div class="container container-header">
    <div class="navbar-header" >
      <div class="visible-sm-block visible-md-block visible-lg-block navbar-brand">
        {% editable snippets 'NavBar Left' type: 'html' %}
      </div>
      <button type="button" class="navbar-toggle collapsed" title="{{ snippets["Header/Toggle Navigation"] | default: resx['Toggle_Navigation'] | h }}" data-toggle="collapse" data-target="#navbar" aria-expanded="false" onclick="setHeight();">
        <span class="sr-only">{{ snippets["Header/Toggle Navigation"] | default: resx['Toggle_Navigation'] | h }}</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
    </div>

	menu bar follows.....