Banner image cuts off on mobile view

Site URL: https://www.vegapropertyemporium.com/ourteam

Hi there,

On mobile, my banner image on page https://www.vegapropertyemporium.com/ourteam cuts off two people from the end. I would like for it to fit everyone in, what is the CSS code please?

Thank you

Add to Home > Design > Custom CSS

/* Our team page */
@media screen and (max-width:640px) {
body#collection-5e9d300fb304792a5840865e {
section.Intro.Intro--has-image figure img {
    width: 100% !important;
    height: auto !important;
    left: 0 !important;
}
section.Intro.Intro--has-image {
    height: 250px !important;
}
}
}

On 11/17/2020 at 6:48 PM, tuanphan said:

Add to Home > Design > Custom CSS

/* Our team page */
@media screen and (max-width:640px) {
body#collection-5e9d300fb304792a5840865e {
section.Intro.Intro--has-image figure img {
    width: 100% !important;
    height: auto !important;
    left: 0 !important;
}
section.Intro.Intro--has-image {
    height: 250px !important;
}
}
}

 

Thank you so much 😊

5 hours ago, Vegaproperty said:

Thank you so much 😊

I see some pages have long content on mobile. You can consider adding a back to top button.

Also, on Tablet, I see this. Do you want to fix?

On 11/19/2020 at 1:34 AM, tuanphan said:

I see some pages have long content on mobile. You can consider adding a back to top button.

Also, on Tablet, I see this. Do you want to fix?

Yes please, if that can be fixed for tablets that would be fantastic. 

Also, the banner images on the home page on mobile are not fitting correctly - is there a code that i could use to fix this? Thank you

https://vegapropertyemporium.com/

On 4/13/2021 at 11:23 AM, Vegaproperty said:

Yes please, if that can be fixed for tablets that would be fantastic. 

 

Also, the banner images on the home page on mobile are not fitting correctly - is there a code that i could use to fix this? Thank you

https://vegapropertyemporium.com/

Add to Design > Custom CSS

/* resize home banner mobile */
@media screen and (max-width:640px) {
section#about figure img {
    width: 100% !important;
    height: auto !important;
    left: 0 !important;
    top: 100px !Important;
}
section#about {
    min-height: unset !important;
}
}

With buttons overlap, add to Design > Custom CSS

/* Tablet our team buttons overlap */
@media screen and (max-width:991px) and (min-width:768px) {
div#block-yui_3_17_2_1_1589349754930_8515+.row .span-3:first-child, div#block-yui_3_17_2_1_1589349754930_8515+.row .span-3:last-child {
    width: 10% !important;
}
div#block-yui_3_17_2_1_1589349754930_8515+.row .span-3:nth-child(n+2) {
    width: 40%;
}
}

Having the same issue on a non-index page. The banner image is cut short on mobile and tablet.

http://www.southernsunevents.com/services

PW: sse2020

On 8/5/2021 at 7:40 AM, SouthernSunEvents said:

Having the same issue on a non-index page. The banner image is cut short on mobile and tablet.

http://www.southernsunevents.com/services

PW: sse2020

Hi. Add to Design > Custom CSS

/* Services banner */
@media screen and (max-width:900px) {
body#collection-5fcfb2fc10aae775717ced63 .Parallax-item:first-child img {
    width: 100% !important;
    height: auto !important;
    left: 0 !important;
}
}