Make the 2nd column sticky only on Portfolio Pages

this could be a nice usage – but the stickyness only belongs to the direct parent container.

https://webers-testseite.de/sticky-elements/

Some explanations are shown here:
https://webers-testseite.de/sticky-sidebar/

i do not see my css code in your page!

have you read my post? i told you that it will not work if there are elements below.
Sticky elements do only hold there place inside the direct parent container. so there must be a column with huge content and the column besides with less height. This could be a sticky element then.

Insert my code above and look to your blog page: https://institutionofelectronics.ac.uk/news/
or more impressive then : https://institutionofelectronics.ac.uk/2025/05/30/designing-power-supplies-for-industrial-functional-safety-part-1/
or did you want something other than a sticky element. e.g. a fixed element, possibly even a draggable element?

ok now you got 2columns besides each other.
if you follow my link for the instructions – you see that the direct parent had to be the flex container.

just for you to test ( better would be to use custom classes to be more specific.

.responsive body#top.blog,
.responsive body#top.wp-singular {
  overflow-x: visible !important;
}

.responsive body#top.blog #wrap_all ,
#top.wp-singular #wrap_all{
  overflow: visible !important;
}

@media only screen and (min-width: 767px){ 
  #after_section_1 .av-column-wrapper-individual {
    display: flex;
  }

  #after_section_1 .av-column-wrapper-individual .flex_column:nth-child(2){
    height: unset !important;
    position: -webkit-sticky !important;
    position: sticky !important;
    top: 180px;
    align-self: flex-start;
    flex: 0 1 40%
  }
}

in most cases these columns will be inside a color-section. Inside that section the one that should scroll has to be with huge content. the other one with less.
Do not use the equal height option on the coluns!

i would give a custom class to that section! f.e. : sticky-parent (this is not the direct parent of those columns. But we can address now better – and use it for that case generally.
The column that should stick got the custom class: sticky-element

then we have:
(we can have the overflow setting inside the media query too – it only needs to work there)
NB: the media query min-width depends on your setting where the columns should go to 100% width – if it is 989px then change that value

@media only screen and (min-width: 767px) {
  .responsive #top {
    overflow-x: visible !important;
  }
  .responsive #top #wrap_all {
    overflow: visible !important;
  }
  #top .sticky-parent .entry-content-wrapper {
    display: flex;
  }
  #top .sticky-element { 
    height: unset !important;
    width: unset !important;
    position: -webkit-sticky !important;
    position: sticky !important;
    top: 80px;
    align-self: flex-start;
    min-width: 40%;
  }
}

again – see: https://webers-testseite.de/sticky-elements/