Joomla Templates Club 406,261 posts

[jamesshin Friend jamesshinJoin date: August 2014Posts: 22Downloads:137Uploads:0 Thanks: 17]

#683267

the background images are not behaving correctly when viewed on iPhones or below 767px. i have 3 images (modules) in place. the first image “Slide 2” is resizing correctly but the 2nd and 3rd images (JA Uber, ELEVATE) is not resizing but enlarges and overflows to the right side. i changed the orders but only the first item will view correctly but the latter shifts position. assistance needed to fix this issue.

thanks in advance…

[Ninja Lead Moderator Ninja LeadJoin date: November 2014Posts: 16064Downloads:310Uploads:2864 Thanks: 341 Thanked: 3854 times in 3563 posts]

#683712

Hi,

In this case, I need to check that bug directly on your site but I could not access the URL of your site.

Regards

[Ninja Lead Moderator Ninja LeadJoin date: November 2014Posts: 16064Downloads:310Uploads:2864 Thanks: 341 Thanked: 3854 times in 3563 posts]

#748451

Hi,

In this case, I need to check that bug directly on your site but I could not access the URL of your site.

Regards

[jamesshin Friend jamesshinJoin date: August 2014Posts: 22Downloads:137Uploads:0 Thanks: 17]

#683913

http://181.224.139.166/~lighth92/hw/administrator/

[jamesshin Friend jamesshinJoin date: August 2014Posts: 22Downloads:137Uploads:0 Thanks: 17]

#748508

http://181.224.139.166/~lighth92/hw/administrator/

[Ninja Lead Moderator Ninja LeadJoin date: November 2014Posts: 16064Downloads:310Uploads:2864 Thanks: 341 Thanked: 3854 times in 3563 posts]

#683980

<em>@jamesshin 492178 wrote:</em><blockquote>http://181.224.139.166/~lighth92/hw/administrator/</blockquote>

Hi,

You can use this way to fix the problem on your site

Open templates/uber/css/custom.css file, add new rule

@media (max-width: 767px) {
.carousel .acm-hero {
width: 100% !important;
height: 100% !important;
background-size: auto 100% !important;
}
}

Regards

1 user says Thank You to Ninja Lead for this useful post

1. jamesshin

[Ninja Lead Moderator Ninja LeadJoin date: November 2014Posts: 16064Downloads:310Uploads:2864 Thanks: 341 Thanked: 3854 times in 3563 posts]

#748575

<em>@jamesshin 492178 wrote:</em><blockquote>http://181.224.139.166/~lighth92/hw/administrator/</blockquote>

Hi,

You can use this way to fix the problem on your site

Open templates/uber/css/custom.css file, add new rule

@media (max-width: 767px) {
.carousel .acm-hero {
width: 100% !important;
height: 100% !important;
background-size: auto 100% !important;
}
}

Regards

1 user says Thank You to Ninja Lead for this useful post

1. jamesshin

[jamesshin Friend jamesshinJoin date: August 2014Posts: 22Downloads:137Uploads:0 Thanks: 17]

#684943

thanks Ninja. i added these lines to custom.css but doesn’t fix the problem. when i scroll down, images enlarges and overflows to the right. this only happens after the first slide.

help?

[jamesshin Friend jamesshinJoin date: August 2014Posts: 22Downloads:137Uploads:0 Thanks: 17]

#748796

thanks Ninja. i added these lines to custom.css but doesn’t fix the problem. when i scroll down, images enlarges and overflows to the right. this only happens after the first slide.

help?

[Ninja Lead Moderator Ninja LeadJoin date: November 2014Posts: 16064Downloads:310Uploads:2864 Thanks: 341 Thanked: 3854 times in 3563 posts]

#684980

Hi,

I fixed the problem directly on your site with the solution below

@media (max-width: 767px) {
.carousel .acm-hero {
width: 100% !important;
height: 100% !important;
}
.acm-hero.full-screen .hero-content {
padding-bottom: 0px !important;
}
}

Now, you can help me to check it again, let me know if it helps

Regards

1 user says Thank You to Ninja Lead for this useful post

1. jamesshin

[Ninja Lead Moderator Ninja LeadJoin date: November 2014Posts: 16064Downloads:310Uploads:2864 Thanks: 341 Thanked: 3854 times in 3563 posts]

#748832

Hi,

I fixed the problem directly on your site with the solution below

@media (max-width: 767px) {
.carousel .acm-hero {
width: 100% !important;
height: 100% !important;
}
.acm-hero.full-screen .hero-content {
padding-bottom: 0px !important;
}
}

Now, you can help me to check it again, let me know if it helps

Regards

1 user says Thank You to Ninja Lead for this useful post

1. jamesshin

[jamesshin Friend jamesshinJoin date: August 2014Posts: 22Downloads:137Uploads:0 Thanks: 17]

#686048

kudos to you Ninja…ty

[jamesshin Friend jamesshinJoin date: August 2014Posts: 22Downloads:137Uploads:0 Thanks: 17]

#748904

kudos to you Ninja…ty

[Author]

Posts