Design question – logo placement

Rikard. to share which code I used to place the image in the site;

add_filter('the_content', 'add_content_after');

function add_content_after($content) {

     $after_content = '<img src="https://www.hoeklijst.nl/wp-content/uploads/2021/02/hoeklijst-logo-linksonder.png" class="bottom-left-image">';
 
     $fullcontent = $content . $after_content;

     return $fullcontent;

}

Rikard, thx for this code, I added it. The strange thing is that initially the border is there, it only dissapears when you start scrolling down.

I think that often enfold shows a line like this when you place an element outside of a column, and as you cant place this element inside a container, I’m thinking that this might have smt to do with this?

Any suggestions? the url is now reachable without password. see link in private.

Hi Rikard, that did the trick!

Two last questions:

– on ios/apple mobile phones the footer acts strangely / doesn’t show. the bottom line
ios:

android:

– on tablet there is no margin/padding around the box/black lines. How can I add this to these devices only?

Hi Rikard,

I struggled a lot with your hook, I did not manage at all to place the bottom-left image close to the ‘frame/border’, so no, I prefer to use the hook I found myself. Can you advice on another method? I find it particularly strange that this footer issue, as described, only happens on IOS/Apple…?

In regards to the (missing) black/lines on tablet: on larger screens and mobile there’s always the boxed website (with the black line all around it). On tablet there is no blackline on the sides: meaning there is no margin/padding on left/right of the ‘boxed’ view/content… can’t really describe it any better, the current images make this pretty clear I guess? So the question is, how do I add padding/margin to the website on tablets?

just these two points & the site is finished. thx in advance for your quick response:)

Rikard,

Please, look at the images, on how the bottom border looks at android devices and how it looks on IOS. The bottom border isn’t the .bottom-left-image … that’s the logo on the bottom left. Codes that are present:

.main_color .container {
border-bottom: 2px solid #000 !important;
border-left: 2px solid #000;
border-right: 2px solid #000;

@media only screen and (max-width: 767px) {
.main_color .container {
border-top: 2px solid #000;
border-bottom: 2px solid #000 !important;
}

yet it doesn’t show on IOS. why?

nudge. still no reply?