WebSite X5Help Center

 
Mandar V.
Mandar V.
User

Image is appearing cropped in a mobile view.  en

Auteur : Mandar V.
Visité 335, Followers 1, Partagé 0  

Please visit https://ashokaengineers.in/index.html

in a desktop view and a mobile view.

Image is appearing cropped in a mobile view.

Attached a screenshot for your kind consideration. Please help.

Posté le
5 RéPONSES
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator

(It > En) ... the two current images on that page are not suitable for the purpose...
... they are now in ratio (15:7)...
... you should have used square images (1:1)  or at most in (4:3)...
... if you can't do it with the program options, and if you want to quickly fix it in a second in one of the possible ways with a simple EXTRA code of mine, ...let me know, ...otherwise wait for the experts' opinion...

.

ciao

.

Lire plus
Posté le de  ‪ KolAsim ‪ ‪
Mandar V.
Mandar V.
User
Auteur

Thanks dear friend KolAsim. 

I'll surely try it in your way. But frankly speaking, the ratio you mentioned shouldn't be an obstacle. Because I have often used wider images, for example, https://www.radhanagari.com/  & https://aasthakop.org/ and they appear properly. 

Is this the issue of that particular object?

Please let me know. 

Thank you once again. 

Mandar

Lire plus
Posté le de Mandar V.
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator

... the problem with images is resizing in CSS cover mode, that is, images are resized rationally on the width or height priority, in center/center position, and therefore if the host window is not in a rational congruent relationship with those of the images, the external parts of the images exceeding the host window may be cut off...

ciao

.

Lire plus
Posté le de  ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
 ‪ KolAsim ‪ ‪
Moderator
Mandar V.
 ... ... ... I'll surely try it in your way. ... ... ... 

ciao, ... now this code of mine, one of many, does nothing but move the image a little bit more to the left...
... you can easily try it, it's harmless...

<style>
@media (max-width: 480px) {
.animable a {background-position:-50px 0 !important}}
@media (max-width: 430px) {
.animable a {background-position:-100px 0 !important}}
/*-K-*/
</style>

.

Lire plus
Posté le de  ‪ KolAsim ‪ ‪