sections in mobile navigation

Hi there,

unfortunately this CSS doesn't really work on mobile:

.sticky-section {
    min-height: 950px; /* Adjust to suit the tallest section */
    position: sticky;
    position: -webkit-sticky;
    top: 90px; /* Adjust to the height of the navigation */
}

You can change it so it only applies to desktop devices like so:

@media (min-width: 769px) {
    .sticky-section {
        min-height: 950px; /* Adjust to suit the tallest section */
        position: sticky;
        position: -webkit-sticky;
        top: 90px; /* Adjust to the height of the navigation */
    }
}

Hi David
I did but didn't work, I need to change some value px for example?
Thanks

1. Remove this CSS:

.sticky-section {
    min-height: 950px; /* Adjust to suit the tallest section */
    position: sticky;
    position: -webkit-sticky;
    top: 90px; /* Adjust to the height of the navigation */
}

2. Add this CSS:

@media (min-width: 769px) {
    .sticky-section {
        min-height: 950px; /* Adjust to suit the tallest section */
        position: sticky;
        position: -webkit-sticky;
        top: 90px; /* Adjust to the height of the navigation */
    }
}

Hi David.
I did and didn't work, look at the video.

the second section after REALITAT VIRTUAL I can't see Més Informació (more information) in the third section too, I can't see LEGAL WEB Més Informació (more information) but in the fourth section I can see two parts XARXES SOCIAL and GOOGLE ADS
Stay in touch.
Thanks

Can you DISABLE your Cache Plugin. Then make sure the CSS is updated. Then view the site in a Private/Incognito browser.

Hi David.
I do all the steps and nothing doesn't matter I forget the sections and work in blocks.
In block Can I do to eliminate the spaces between blocks?

THANKS

Can you share a link to the page where I can see the problem?

Hi David
http://www.ccfoto.cat for mobile navigation.
The other now is a draft when I finish I will send it

Thanks

For the mobile scrolling problem.
Can you remove all of the CSS related to the Sticky Sections - so they scroll normally.

Then add this CSS:

@media (min-width: 769px) {
    .sticky-section {
        min-height: 950px; /* Adjust to suit the tallest section */
        position: sticky;
        position: -webkit-sticky;
        top: 90px; /* Adjust to the height of the navigation */
    }
}

Hi David
This is all code there're in ccs style.

/*
 Theme Name:   GeneratePress Child
 Theme URI:    https://generatepress.com
 Description:  Default GeneratePress child theme
 Author:       Tom Usborne
 Author URI:   https://tomusborne.com
 Template:     generatepress
 Version:      0.1
*/
@media (min-width: 769px) {
    .sticky-section {
        min-height: 950px; /* Adjust to suit the tallest section */
        position: sticky;
        position: -webkit-sticky;
        top: 90px; /* Adjust to the height of the navigation */
    }
}
css
.content-box-yellowGreen,
.content-box-powderblue,
.content-box-mediumAquamarine,
.content-box-gold,
.content-box-khaki,
.content-box-lightGreen,
.content-box-moccasin,
.content-box-yellow 
{
margin: 0 0 25px;
overflow: hidden;
padding: 20px;
}

.content-box-yellowGreen {
background-color: #FFFFFF;
border: 1px solid #000000;
}

.content-box-powderblue {
background-color: #FFFFFF;
border: 1px solid #000000;
}

.content-box-mediumAquamarine {
background-color: #FFFFFF;
border: 1px solid #000000;
}

.content-box-gold {
background-color: #FFFAFA;
border: 1px solid #000000;
}

.content-box-khaki {
background-color:#FFFFFF;
border: 1px solid #000000;
}

.content-box-lightGreen {
background-color: #FFFFFF;
border: 1px solid #000000;
}

.content-box-moccasin {
background-color: #FFFFFF;
border: 1px solid #000000;
}

.content-box-yellow {
background-color: #FFFFFF;
border: 1px solid #000000;
}

.content-box-blue {
background-color: #FFFFFF;
border: 1px solid #000000;
}
.block-container {
    display: flex;
}

.block-container a {
    width: 33%;
}

	a[class|="caixa-1"]{
		position:static;
		display:flex;
		
	}

	a[class|="caixa-2"]{
		position:static;
		display:flex;
		text-decoration:none;
		
	}

	a[class|="caixa-3"]
{
		position:static;
		display:flex;
		text-decoration:none;
		
	}
img {
  display: inline-block;
}

Hi there,

It doesn't seem to be updating, then. Here's what I'm seeing right now: https://www.screencast.com/t/iO7JFausZ

You can see it's missing the @media part.

Is there any other sort of caching going on? Maybe server caching?

Also, the css text below it is invalid, you should remove that or all of the CSS below it won't work.

Hi Tom
How is it posible?
I have that in my style css
https://www.screencast.com/t/g9OQJyZX
Thanks

Hi there
Will, it's my new ccs style?
https://www.screencast.com/t/O1K6lNAKFW
Thanks

It looks like your CDN is not updating the cached files. Can you disable the CDN for now?