Hi,
The logo on this website https://www.cgrconsultor.com/ shows distorted on mobile safari and chrome.
On the computer its fine, what could be the issue?
Only on my mobile, so haven’t looked on desktop or checked Blocs, but first 2 things I’d check are:
Make sure the logo isn’t an svg file (throughout the site they’re fine, but for a logo in the header, I always have problems)
Check the dimensions of the logo box at the smaller breakpoint and adjust if necessary.
Can’t offer any more than that at the moment, sorry.
thanks i will check
Hola, usar svg para el logo es una buena práctica y funciona de la misma manera que una imagen de otro tipo. Sino podes usar una imagen en webp de buen tamaño.
Respecto a la distorsión, revisá que no hayas agregado ninguna clase que sobreescriba las proporciones del logo en ese breakpoint, o que accidentalmente hayas puesto un valor y se te haya modificado para xs.
Revisá tambiĂ©n que el row del logo tenga las columnas necesarias como para que se vea bien y no quede más chico. PorĂas darle 9 columnas sin problemas por que en ese breakpoint solo tenĂ©s logo y nav.
Sorry @chicuelo, SVG’s have never used for me in a navbar bloc - even up until about a month ago when I last tried. They just come out as full size logos and don’t shrink to fit the navigation.
It could of course be how they’re encoded somehow, but I’ve had things supplied to me and generated them myself and it’s always been the same scenario. Fine throughout the rest of the site, weird in the nav area.
So in theory they’re fine, but if I’ve been having problems, then it’s more than possible that other people could be. Worth checking to see if another format might work better.
You could try, but you are adding an image so it will be treated the same way as a png, jpg or webp.
The advantage is svg is a vector file, crisper and lighter
1 Like
Yes, I realise that, and I can’t see any reason why they shouldn’t work for me - but they just………don’t!
Must be the wind blowing in the wrong direction or me giving off negative vibes.
1 Like
As a test:
Simply drag the SVG file into an empty browser window and change the size of the window. If the graphic adjusts, then it is not due to the SVG file itself. The SVG may also have too much space around itself.
Ideally, the graphic should fit completely within the window, with little or no white space around it. It should fit either in width or height, regardless of how the window is resized.
This means that if the graphic adapts to the size of the window, it is OK.
The next step was to test the settings in Blocs or assigned classes.
Thanks @BLOCS-Freak, I appreciate your input, very kind.
I must stress though, that the only problems I have had concerned the navbar setup.
Using the exact same logo works as expected in different parts of the site - just not in the navigation area.
Changing the logo to a png, and just replacing the svg - leaving the class settings the same, the results are what I expected and wanted.
So with me it seems to be specifically an svg in the navbar, nowhere else.