Okay
  Public Ticket #1042214
Changing dimension one the images
Closed

Comments

  •  2
    Alessandro started the conversation
    January 30, 2017 at 10:03pm

    Hello, here i am again!! :)

    Is it possible to change to dimension of the pics from 1200px to, for example, 1000px ?

    Thank you !!

  •  295
    Paul replied
    January 31, 2017 at 11:59am

    Hi!

    Did you mean the image on the top of a page? (eg. your "About" page)

    If so, then you can use custom CSS to force that:

    .page .post-image {
    margin: auto;
    width: 1000px;
}

    You can apply the code by going to "Appearance > Customize > Additional CSS".

    If you would also like to use custom CSS for other elements, I recommend Developer Tools on Chrome or Firebug on Firefox to inspect the elements on the page. Then you will know which CSS selector to adjust.

    More info: https://uxbarn.com/inspecting-elements-developer-tools/

    Regards,
    Paul

  •  2
    Alessandro replied
    January 31, 2017 at 9:25pm

    Thank you Paul !!! :)

  •  2
    Alessandro replied
    February 1, 2017 at 2:56am

    Hi Paul, here i am again... sorry :(

    No, i meant  the images in the galleries ( 1200x800 pixels ), not the ones at the top of the pages.

    I looked in the css for the lines with "1200px" to change them but i couldn't find any.

  •  295
    Paul replied
    February 1, 2017 at 5:08am

    Please try this:

    .port-format-content .image-wrapper {
    margin: auto;
    width: 1000px;
}

    It will reduce the width of portfolio images on portfolio single pages to 1000px.

    Hope this helps!

  •  2
    Alessandro replied
    February 1, 2017 at 1:18pm

    Paul, PERFECT !! Thank you !!!

  •  2
    Alessandro replied
    February 1, 2017 at 2:06pm

    Argh Paul !! On the PC the mod works perfectly, but on the mobile version it's not working properly...

    Here attached the mobile shot...

    I hope all my stupid questions will help other customers at any rate...:)

  •  295
    Paul replied
    February 2, 2017 at 4:42am

    Whoops! Try this:

    .port-format-content .image-wrapper {
    max-width: 1000px;
}
.port-format-content .image-wrapper:not(.portrait) {
    margin: auto;
}
@media only screen and (max-width: 1100px) {
    
    .port-format-content .image-wrapper:not(.portrait) {
        margin-left: 2.5%;
        margin-right: 2.5%;
    }
}

    It should be working as expected now.

  •  2
    Alessandro replied
    February 2, 2017 at 3:59pm

    Now it's simply PERFECT !!!

    Thank you !!! :)

  •  295
    Paul replied
    February 4, 2017 at 3:23am

    You're welcome!