Side Bar image top margin

Hi,
Sorry for the late reply and thanks for the login, I took a look at your page and added this css in your WordPress > Customize > Additional CSS field:

@media only screen and (min-width: 1440px) { 
	#top.page-id-2524 #main > div.container_wrap_first.container_wrap > div {
		width: 73% !important;
		float: left !important;
        max-width: 1350px !important;
	}
	#top.page-id-2524 #main > div.container_wrap_first.container_wrap {
		width: 90% !important;        
		margin: auto !important;
	}
	#top.page-id-2524 #wrap_all #main .sidebar {
        width: 352px !important;
	}
	#top.page-id-2524 #main > div.container_wrap_first.container_wrap > div > main {
		 width: 100% !important;
	}
}

I also found that your inner page height didn’t match your content height so I added this script to your functions.php

function custom_script(){
  ?>
  <script>
(function($){
  $(window).load(function(){
      var s1 = $('#top.page-id-2524 #main > div.container_wrap_first.container_wrap > div ').height();
    var s2 = $('#top.page-id-2524 #main > div.container_wrap_first.container_wrap').height();

    if (s1 > s2)
        $('#top.page-id-2524 #main > div.container_wrap_first.container_wrap').css('height', s1 + "px");
    else
        $('#top.page-id-2524 #main > div.container_wrap_first.container_wrap > div').css('height', s2 + "px");
  });
  })(jQuery);
  </script>
<?php
}
add_action('wp_footer', 'custom_script');

please clear your browser cache and check.

Best regards,
Mike

Hi,
Sorry for the late reply, I took another look at your page, but it seems ok to me. Please see the screenshot in Private Content area. Please explain what is wrong and which browsers you have tested with.
If you could upload a screenshot with the error highlighted it would be helpful.

Best regards,
Mike

Hi,
Ok, looking at your /koh-haa-diving/ page for mobile I see the sidebar is very low with a large gap, so I adjusted the script to only work screens larger than 1440px.
Please clear your browser cache and check.
What is wrong with the desktop version?
Please note that if testing on a desktop and resizing the window to simulate different device sizes you will need to reload the page for the window size to be recognized at each size you test. This doesn’t affect actual devices just resized desktop browsers.

For future reference this is the updated script:

function custom_script(){
  ?>
  <script>
(function($){
  $(window).load(function(){
	  var width = $(window).width()
      var s1 = $('#top.page-id-2524 #main > div.container_wrap_first.container_wrap > div ').height();
    var s2 = $('#top.page-id-2524 #main > div.container_wrap_first.container_wrap').height();

    if (s1 > s2 && width >= 1440) {
        $('#top.page-id-2524 #main > div.container_wrap_first.container_wrap').css('height', s1 + "px");
	}  else {
        
	}
  });
  })(jQuery);
  </script>
<?php
}
add_action('wp_footer', 'custom_script');

Best regards,
Mike

Hi,
Sorry, that is not how it looks to me, please see the screenshot in Private Content area.
The two pages don’t look the same because on the other pages you have the top image in a color section, on the page it is just an image. I disabled the script from above since you said this was not an issue until it was added.

Best regards,
Mike

Hi,
Thank you for the feedback, I now see that you have been using laptops so I imagine your screen width is about 1440px, and at about that width I see this error. My desktop is larger than this so I was missing it.
What is your max screen resolution for your laptops?

Best regards,
Mike