Home Forums Weaver Xtreme Theme Featured Image taking over site header. How to stop it?

Topic Resolution: Answered
Viewing 9 posts - 17 through 25 (of 25 total)
  • Author
    Posts
  • #71971
    User
    Moderator

    This should work:

    .is-phone .blog-post-cols-3 {width:100%;}

     

     

    #71991
    doland
    Participant

    Oh nice! it worked. thanks bud. So I went into the Global Custom CSS and it looks like I already had code in there from this forum:

    .is-desktop #sitewide-top-widget-area {display:none;}
    .blog-post-cols-3:nth-of-type(3n+1) {clear:both;}
    
    @media only screen and (max-width:768px) {
    .blog-post-cols-3:nth-of-type(3n+1) {clear:none !important;}
    .blog-post-cols-3:nth-of-type(2n+1) {clear:both;}
    }

    After removing and putting it back, I see that this code is what makes that “Hey mobile user” widget show up on mobile:
    .is-desktop #sitewide-top-widget-area {display:none;}

    I assume the other code is what was previously telling it to show one column on mobile but no longer words on Xtreme? Just wondering why your code and this one both say “cols-3” instead of cols-1 or something.

     

    #71992
    User
    Moderator

    Here’s the source for the code.

    I couldn’t get other versions to work…

    https://forum.weavertheme.com/forums/topic/masonry-blog-page-not-fully-responsive/

    #71995
    scrambler
    Moderator

    @user. which one did you try exactly that did not work?

    because the second one is the same as the first but only applies to Phone, if that does not work it may need !important

    The last one is just a modification of the device selector to attach the page selector.

    #72007
    User
    Moderator

    @scrambler.  Sorry for the misunderstanding.

    By “other versions” I had in mind something similar to what doland wrote, during  my testing of  ““cols-3” instead of cols-1 or something…” when I was working on it .

    I tried all variations I could find on this, of “cols-1”  “cols-2” and so forth, plus other similar descriptors, but none worked.

    Then I changed tactics and searched the Forum – though that took a while before finding the right words to search, so it would provide useful results.  🙂

    I worked backwards through the results and tried each one, but none of the ‘solutions’ worked till I came to your 2017 post.

    When I read your 2017 comment, I knew it would work – and it did.

    What you wrote matched what I had found.  If I started with 2 columns, the mobile would give me 1 by default.  If I started at more than 2, the mobile would give 2 as the default.

    Sometimes the naming logic here is simple to follow, and sometimes it needs rather more insight into the sequencing and processing, beyond just the naming conventions.   🙂

    Regards!

    #72009
    scrambler
    Moderator

    The way to know what you are looking for is to inspect the page with the browser developer tool, so you can see what rules are used to create the style.

    You can have a look at the guide article below for some pointers

    Browser Developer Tools and Code Validation – Weaver Xtreme Guide (weavertheme.com)

     

    #72010
    hkp
    Participant

    Thank you. Yes I did that. But while some is quite intuitive, some is much less intuitive as to what is next. 🙂
    Will re-read the pointers for more insight. Thanks for reminding me of that.

    #72014
    scrambler
    Moderator

    If you need guidance on how to figure out selectors to create custom CSS rules, feel free to post here, we are happy to help you learn how to figure it out 🙂

    #72015
    hkp
    Participant

    @Scrambler

    Thank you! May take you up on that at a quieter time 🙂

Viewing 9 posts - 17 through 25 (of 25 total)
  • You must be logged in to reply to this topic.