For the mobile version of my page there are white spaces in between the images that I can't seem to remove.
When I inspect the coding and toggle the min-height on and off it goes away:
@media only screen and (max-width: 1024px)
.edgtf-section.edgtf-parallax-section-holder:not(.edgtf-full-screen-height-touch), .touch .edgtf-parallax-section-holder.edgtf-parallax-section-holder-touch-disabled:not(.edgtf-full-screen-height-touch) {
height: auto !important;
min-height: 400px;
}
Website: Creationflame.com
Conversation. CSS tip: To reset a min-height or min-width declaration, set it to "0", not "auto". For max-height/width, the initial value is "none".
Defines the min-height as an absolute value. <percentage> Defines the min-height as a percentage of the containing block's height. auto. The browser will calculate and select a min-height for the specified element.
The min-height property defines the minimum height of an element. If the content is smaller than the minimum height, the minimum height will be applied. If the content is larger than the minimum height, the min-height property has no effect.
Min height 100vh means the element should occupy the web browser viewport height. This is always 100 percent of the web browser's viewport height. If there is more content, the element will stretch more than the viewport's height, which is a code example that will clear things up.
min-height:initial;
This sets it back to what it was originally.
The initial CSS keyword applies the initial value of a property to an element. It can be applied to any CSS property, including the CSS shorthand all.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With