Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0

Images resized for mobile - Degraw template


OldMate

Question

I am trying to get full bleed images to resize on mobile so that that show in full, currently seem to be locked to a height meaning images focal points that are not central to the image are being cut-off. Any help would be appreciated.

Link to comment

5 answers to this question

Recommended Posts

  • 0
On 9/15/2021 at 3:31 PM, OldMate said:

I am trying to get full bleed images to resize on mobile so that that show in full, currently seem to be locked to a height meaning images focal points that are not central to the image are being cut-off. Any help would be appreciated.

Hi,

Can you share site url?

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
  • 0
On 9/15/2021 at 3:31 PM, OldMate said:

I am trying to get full bleed images to resize on mobile so that that show in full, currently seem to be locked to a height meaning images focal points that are not central to the image are being cut-off. Any help would be appreciated.

Hi,

You mean the girl image or which image?

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
  • 0
2 hours ago, tuanphan said:

Hi,

You mean the girl image or which image?

All full bleed images where what I was trying to solve the issue for, so the girl image on the homepage and the full bleed image block on the services page.

Note: I have manually cropped the home page image to make it work for client approval, I would still prefer the image block be responsive to mobile using width rather than height of the block.

Link to comment
  • 0
23 hours ago, OldMate said:

All full bleed images where what I was trying to solve the issue for, so the girl image on the homepage and the full bleed image block on the services page.

Note: I have manually cropped the home page image to make it work for client approval, I would still prefer the image block be responsive to mobile using width rather than height of the block.

Try adding this to Design > Custom CSS (this for image on homepage)

/* resize homepage image mobile */
@media screen and (max-width:767px) {
[data-section-id="61394b516866c938e302e24a"] {
	.section-background, .section-background-content {
    opacity: 1 !important;
}
img {
    visibility: visible !important;
    opacity: 1 !important;
    object-fit: contain !important;
    height: auto !important;
}
.section-background-canvas.background-fx-canvas {
    opacity: 0 !important;
}
& {
    min-height: unset !important;
    height: 45vh;
}
}
}

image.thumb.png.e2cfee696b1b231ba67d5c99add0a2d5.png

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...