How to reduce the size of the post images on the home page on mobile devices

Forums » WordPress » Fluida » How To

  • Author
    Posts
  • September 20th, 2018 at 10:11 #68407
    Aleksandramailas

    Hi,

    Thanks again for an amazing Fluida theme which perfectly works for me.

    Could you please help me with some css code to reduce the size of the post images on the home page on mobile devices?

    Thank you.

    Aleksandra

    September 23rd, 2018 at 15:44 #68512
    Zed
    Cryout Creations mastermind

    Do you want to do that for the featured images in posts list? Or are you perhaps referring to other images displayed on the homepage when the theme’s landing page feature is used.

    If you like our creations, help us share by rating them on WordPress.org.
    Please check the available documentation and search the forums before starting a topic.
    September 27th, 2018 at 16:28 #68670
    Aleksandramailas

    I refer to home page where the most recent posts are listed. One post takes the whole screen on mobile devices. I would like to reduce the images if possible.

    October 4th, 2018 at 13:14 #68932
    Zed
    Cryout Creations mastermind

    Can you provide a link to your site?

    If you like our creations, help us share by rating them on WordPress.org.
    Please check the available documentation and search the forums before starting a topic.
    October 5th, 2018 at 09:49 #68960
    Aleksandramailas

    Hi,

    Sure. https://www.tripeconomist.com

    Thank you.

    Aleksandra

    October 18th, 2018 at 16:14 #69460
    Zed
    Cryout Creations mastermind

    The theme rearranges it structure depending on screen size it is viewed on. On some devices / screen layout, the posts will use up the full screen width. Depending on the configured posts images height, their images may fill up the entire screen (both width and height).

    How are you looking to reduce/limit the post images? In what way?

    If you like our creations, help us share by rating them on WordPress.org.
    Please check the available documentation and search the forums before starting a topic.
    October 20th, 2018 at 21:37 #69543
    Aleksandramailas

    Hi,

    I found the way. I added this CSS code and the result is exactly what I was asking for.

    @media only screen and (max-width: 480px){ .fluida-cropped-featured .main .post-thumbnail-container {
    height: 200px;
    }}

    Thank you again for your support.

    Aleksandra

  • Author
    Posts
Viewing 7 posts - 1 through 7 (of 7 total)

The topic ‘How to reduce the size of the post images on the home page on mobile devices’ is closed to new replies.