Place image on bottom of page footer

Hi

I would like to place a puffin, either standing with his foot on top of the hr line dividing the footer underneath,

or standing at the very bottom of the page, in the footer section, with some margin space on the left.

It is hovering in the air on top of the line at the moment https://www.quodvultdeus.com/

Any ideas?

This topic has been closed for replies.

Correct answer osgood_

still not working

Your best option is to rework your code:

Instead of:

<div class="row col-md-3">
<div id="puffin"><img src="/Img/puffin@2x.png" alt="" width="120" class="img-fluid"/>
</div>
</div>
<hr class="my-4">

Replace with:

<div class="container-fluid border-bottom mb-3">
<img class="ml-4" src="/Img/puffin@2x.png alt="" width="120">
</div>

Community Expert

In other words, change

#puffin {
    margin-left: 50px;
    bottom: 0px;
}

to

#puffin {
    margin-left: 50px;
    margin-bottom: -15px;
}

Wappler is the DMXzone-made Dreamweaver replacement and includes the best of their powerful extensions, as well as much more!

Inspiring

unfortunately that didn't work?

Community Expert

Try

#puffin {
    margin-left: 50px;
    margin-bottom: -15px !important;
}

Wappler is the DMXzone-made Dreamweaver replacement and includes the best of their powerful extensions, as well as much more!

Sign up