[Support request] Weird margin on list

Please login to receive premium support.

Support for the free plugin can be found here.

Home Forums Pro Support Weird margin on list

This topic contains 7 replies, has 2 voices, and was last updated by  Tom 3 months, 1 week ago.

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #11578

    Bas
    Participant

    Hi,

    I setup a test page to recreate a list with wp show posts from a custom coded list.
    I used the cards base layout.

    When I load the test page there is a weird margin of 20px to the left of the list.
    When I remove that margin, the featured image is a few pixels short left and right although it is the correct size.

    Maybe I am missing something, I can’t find the problem.

    At the test page, the top list is from wp show posts and the bottom list is my custom coded list.

    My questions are..

    1 – How do I correct the left margin on the list.
    2 – How do I recreate the image sizes so they are the same as my custom coded list.

    Test page HERE

    #11591

    Tom
    Keymaster

    Hi there,

    That margin is happening because of this CSS you’ve added:

    .how-to.wp-show-posts-columns {
        margin-left: 0!important;
    }

    The negative margin on that element is needed to achieve the column gutters.

    I’m not seeing any differences between images – can you explain a bit more?

    Let me know 🙂

    #11627

    Bas
    Participant

    You kidding me… haha.

    When I test CSS code, I put it at the top of the CSS file in order to tweak it until it is right, then I move it to it’s respected code group in the CSS file.
    I guess I forgot about it.
    Thanks for clearing this !

    About the images…

    I am looking for a way to control the size of the “smaller” images except the featured image.
    Is it possible to give those images a specific width and height, conserving aspect ratio?

    #11645

    Tom
    Keymaster

    So just to confirm, you want to size the featured post image differently than the smaller posts in two columns?

    Let me know 🙂

    #11646

    Bas
    Participant

    Yes sir,

    I want to size the images in the 2 columns.
    I set the size for the featured post in the image settings menu.

    #11659

    Tom
    Keymaster

    Can you give this a shot?:

    add_filter( 'wpsp_image_attributes', function( $atts ) {
        // Set up our conditional
        if ( in_array( 'featured-column', get_post_class() ) ) {
            $atts[ 'width' ] = 1200;
            $atts[ 'height' ] = 400;
            $atts[ 'crop' ] = true;
        }
    
        // Return our options
        return $atts;
    } );

    Let me know 🙂

    #11932

    Bas
    Participant

    Hi, sorry for the late reply but I can’t seem to notice any changes.

    I set the width and height in your snippet to 180

    you can see the result HERE

    #11940

    Tom
    Keymaster

    I just updated the code here: https://wpshowposts.com/support/topic/weird-margin-on-list/#post-11659

    Can you give it another shot?

    Let me know 🙂

Viewing 8 posts - 1 through 8 (of 8 total)

You must be logged in to reply to this topic.