[Support request] Left Alight Thumbnail in Mobile View

Home Forums Support [Support request] Left Alight Thumbnail in Mobile View

Home Forums Support Left Alight Thumbnail in Mobile View

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #677607
    Sourish

    hello,

    I would like to align the thumbnail on homepage of my website on the left while in mobile view. It automatically centres. I am using the GP theme .

    Also is it possible to reduce the size of thumbnail by a certain % when in mobile view , so it works well on smaller screens when aligned left.

    thank you .

    GeneratePress 2.1.4
    GP Premium 1.7.2
    #677691
    David
    Staff
    Customer Support

    Hi there,

    can you provide a link to the site? you can edit the original Topic and use the Site URL field for privacy.

    #677781
    Sourish

    Hello ,

    I have added the site url which i am using for this testing purpose.

    Sourish

    #677785
    David
    Staff
    Customer Support

    So try this CSS:

    @media (max-width: 768px) {
        body:not(.post-image-aligned-center) .inside-article .post-image {
            float: left;
            margin-right: 1.5em;
            width: 100px;
        }
         .entry-summary {
             font-size: 0.9em;
         }    
    }
    #677975
    Sourish

    that worked perfectly. is there a way to reduce the size of the image.

    Sourish

    #677981
    David
    Staff
    Customer Support

    The code above reduces it to 100px on devices upto 768px
    If you wanted to reduce it further on mobile, you could add this code as well:

    @media (max-width: 360px) {
        body:not(.post-image-aligned-center) .inside-article .post-image {
            margin-right: 1em; /* adjust for spacing */
            width: 80px; /* adjust for image size */
        }
    }
Viewing 6 posts - 1 through 6 (of 6 total)
  • You must be logged in to reply to this topic.