Ads break the heights of other elements

[kryne]

After at least one ad was shown on the site, the following inline style is added in some HTML tags (coincidentally it's the two in my app.component.html):

{height: auto! important} {min-heigth: 0px! important}

In my case, this causes the footer to be lifted when the content does not fill the height of the viewport.

I'm not sure this is a ng2-adsense issue, but I think it's not wrong to comment here.

Thank you.

[AndesCode]

Hello, im having this very same issue, it seems like the ng-adsense tag is making one of my main elements to have a min-height: 0px! important which is very annoying.

omg, it was really necesary to add that !important -_-"?

Any possible solutions? no matter what style I try to set on the element, it always return to min-heigth: 0px! important

[scttcper]

this component only sets a height on itself if you have provided one, you can see everything it is doing here https://github.com/scttcper/ng2-adsense/blob/master/src/lib/adsense.component.ts

You are likely seeing something adsense is doing.

[AndesCode]

You are totally right, it's something adsense is doing... this is most unplease from adsense...

I found this work around here, hope it's useful for someone out there :

const wrapper = document.getElementById('main-wrapper') // <--- your element mutating
const observer = new MutationObserver(function (mutations, observer) {
  wrapper.style.height = ''
  wrapper.style.minHeight = ''
})
observer.observe(wrapper, {
attributes: true,
attributeFilter: ['style']
})