JoomlArt Forums 32,862 posts

[gringo211985 Friend gringo211985Join date: May 2012Posts: 678Downloads:197Uploads:121 Thanks: 77 Thanked: 123 times in 27 posts]

#731033

Hi there,

I have seen hundreds of posts in the forums about this topic and I have found that nearly all of JA’s templates have a small bug with the responsiveness of the templates.

I created a post about Sugite having a responsive issue and when I tested more templates I found errors on nearly all tested. You can see the post http://id.joomlart.com/forums/topic/sugite-is-not-responsive-please-fix/!!!

So the problem we have is that at certain resolutions nearly all of the templates have a user experience error and will lower rankings in Google. The problem in Sugite is that they have set @media(min-width:1200px) to width:1220px + padding: 40px which should be @media(min-width:1300px)

As we need to change the template.css to fix this properly it will be overridden in updates from JA. What I would like is for JA to fix all the templates for people and then release the update so we don’t have to worry about this.

Here are a couple of examples, using recent templates

To replicate this error you can simply go to any of the JA templates click the little “x” in top right corner so you see the full demo site and then resize your browser to test all resolutions. Or go to http://ja-events-ii.demo.joomlart.com/index.php/en/ and resize through 1150px to 1300px and you will see.

Please can we get this fixed as soon as possible, it’s literally like 3 lines of code that need changing in each template then a quick check on the demo to make sure nothing is broken.

Thanks,
Richard

1 user says Thank You to gringo211985 for this useful post

1. Saguaros

[Saguaros Moderator SaguarosJoin date: September 2014Posts: 31405Downloads:237Uploads:471 Thanks: 845 Thanked: 5346 times in 4964 posts]

#749920

Hi Richard,

I will pass this to the team for further checking on this.

Thank you for your report!

[gringo211985 Friend gringo211985Join date: May 2012Posts: 678Downloads:197Uploads:121 Thanks: 77 Thanked: 123 times in 27 posts]

#750648

<em>@Saguaros 494585 wrote:</em><blockquote>Hi Richard,

I will pass this to the team for further checking on this.

Thank you for your report!</blockquote>

Hi @saguaros

No problem at all, I should have also given some help for the fix so here it is.

The error is the same for all of the templates and is located in all of the /templates/jatemplatename/css/template.css files.

Then simply search for all of the “min-width” and “max-width” classes and change to make sure that there are no conflicts.

For max-width classes we need the container + padding to be less than max-width like.

@media (max-width:1300px) {
.container {
width: 100%;
max-width: 1220px;
}
}

This gives the container 1220px and 40px left and right for the padding.

If you send me a pm I’ll be happy to send through a couple of edited template.css’s.

Thanks,
Richard

1 user says Thank You to gringo211985 for this useful post

1. Saguaros

[Author]

Posts