Navigation
This is archived content. Visit our new forum.

Tagged: 

  • Author
    Posts
  • #1370426

    Michael P
    Participant

    Hi,

    I have a two-up block grid item for which I want to change the break point. The Cornerstone default is stacking the two block grid items when iPhone portrait size is reached.

    I would like it to stack at tablet/ipad portrait size – can you help with the CSS for that?

    Many thanks!

    #1370505

    Rupok
    Member

    Hi there,

    Thanks for writing in! It would be possible with some CSS. To make sure it won’t affect other elements, you can add a custom class to the element or the container (section/column). Update us with your URL after adding the class and point us the element so that we can tailor some code for you.

    Cheers!

    #1370511

    Michael P
    Participant
    This reply has been marked as private.
    #1370773

    Rupok
    Member

    Hi there,

    Thanks for writing back! You can add this under Custom > CSS in the Customizer.

    @media only screen and (max-width: 979px) {
    .x-block-grid.two-up > li {
    	width: 100%;
    	margin-right: 0;
    }
    }

    Hope this helps.

    Cheers!

    #1370803

    Michael P
    Participant

    Perfect thanks!

    #1370830

    Jade
    Moderator

    You’re welcome.

    #1373950

    Michael P
    Participant

    Hi again,

    I need to re-open this topic, as the css Rupok gave me here has stopped working properly.

    The two-up grid items in question now don’t fill the screen width to 100% – the image above the video is sitting over to the left at the specified media width. I tried changing the code to:

    @media only screen and (max-width: 979px) {
    .x-block-grid.two-up > li {
    	width: 100%;
    	margin-right: 0 !important;
    }
    }

    It didn’t help.

    In addition, the four-up block grid further down the page (CAST section) has started misbehaving. When it gets to a certain media width, the default behaviour should be two images side-by-side at 100% width. Now it looks like there is padding either side!

    I’ve tried everything to fix the layout, but I’m really lost as to what’s causing this, especially as it was all looking great before!

    Many thanks.

    #1374515

    Rue Nel
    Moderator

    Hello There,

    Thanks for updating this thread. This could just be a caching issue. Since you have installed a caching plugin WP Super Cache, please clear your plugin cache before testing your site. This can cause the changes to not take place on the front end. It will eventually show up when the cache regenerates, but it’s not ideal if you’re looking to see your changes immediately. Caching plugins are best to turn on only when you’ve finished building the site.

    Please let us know how it goes.

    #1374687

    Michael P
    Participant

    Thanks for your help – the cache had indeed been cleared for testing purposes before I posted my reply, and WP Super Cache switched off.

    However this seems to have resolved itself overnight, so I guess something must have remained in the cache, even though it had already been cleared.

    I will keep an eye on it and report back if I have any further issues.

    Thanks again.

    #1374730

    Rue Nel
    Moderator

    Hey There,

    You’re welcome! We are just glad we were able to help you out.
    Thanks for letting us know that it has worked for you.

    Cheers.

    #1375014

    Michael P
    Participant

    On further inspection, I’ve discovered this was not a caching issue.

    The problem is related to Jetpack Photon. When Photon is turned on, it breaks the layout in the way described in post #1373950 above. Evidently one of Themeco’s support agents must have switched Photon off when inspecting the site, hence fixing the problem.

    Any idea why Photon might be causing this? I’ve turned Photon off for the moment, but perhaps this is something to submit to your development team, as so many people use it?

    Many thanks.

    #1375586

    Nabeel A
    Moderator

    Hi again,

    Regretfully, we cannot provide support for third party plugins or scripts as our support policy in the sidebar states due to the fact that there is simply no way to account for all of the potential variables at play when using another developer’s plugin or script. Because of this, any questions you have regarding setup, integration, or troubleshooting any piece of functionality that is not native to X will need to be directed to the original developer.

    Thank you for your understanding.

    #1376923

    Michael P
    Participant

    Thanks – yes of course, I do understand that.

    However, Jetpack is an extension provided by Automattic, the developers of WordPress, and is so frequently used that it has almost become a default part of WordPress itself.

    I was just suggesting that it might be something for your development team to look at, bearing in mind how embedded it has become in so many WordPress installations.

    #1376977

    Christian
    Moderator

    Thanks for your feedback. I’ll forward your concern. Please bear in mind though that supporting Jetpack or Jetpack features is not a requirement so we could not promise an integration for this.