-2

I'm following this example to get my footer to stay at the bottom on my site.

It's working, but I need to set the body with the style style="min-height: 100vh;" rather than use the class min-vh-100.

Can anyone help me understand why the class isn't working on my site?

isherwood
  • 58,414
  • 16
  • 114
  • 157
VFR292
  • 89
  • 1
  • 7
  • As others have mentioned, the class is not included in your CSS. I'm assuming you're running it through some minimizer that removes unused classes. Because of this it's hard to answer, but by adding the `min-vh-100` class myself and using it, I get the expected result. – Erik Lumme Jul 14 '21 at 13:27
  • @ErikLumme, I don't see any styles applied when adding the class manually. Did you disable the inline styles? – isherwood Jul 14 '21 at 13:29
  • 1
    You're using bootstrap 4.1 in your website, and if you [look in the docs](https://getbootstrap.com/docs/4.1/utilities/sizing/) `min-vh-100` is not listed there, you have to upgrade to at least [4.2](https://getbootstrap.com/docs/4.2/utilities/sizing/#relative-to-the-viewport) to use it – Gunther Jul 14 '21 at 13:31
  • 1
    @isherwood to clarify, I got the expected result when creating a style rule for `min-vh-100` myself, and then using it. The point being that if OP would've used a version of Boostrap locally where the class was included, the issue would not be due to specificity. – Erik Lumme Jul 14 '21 at 14:13
  • I think it was a Bootstrap version issue, I updated to 4.6 and the problem was solved. Thank you for your help :) – VFR292 Jul 15 '21 at 14:18

1 Answers1

2

You're loading v4.1, which is rather ancient and doesn't include the min-vh-* classes. I suggest updating to the latest v4.x.

isherwood
  • 58,414
  • 16
  • 114
  • 157