-
Posts
-
Hi there,
I’ve discovered that a layerslider I’ve designed for a client renders differently in safari, chrome and firefox.
See link in private content, layerslider in the top.
The boxes for the “kontakt mig idag” are placed differently in relation to the other boxes, and the text overflows the box in the first paragraph to the right of the slide in safari (also in mobile on an iPhone), does so partly in firefox, and doesn’t in chrome. I’ve tried with different fonts, and the issue seems to persist between fonts.
Any help? :)
Best regards,
MartinHey Martin,
Can you please show us the 3 different screenshots so we can figure out the issue?
Best regards,
BasilisHi,
Thank you for the update.
Did you separate the text or heading background from the actual box? Try to combine the box and the text into a single layer. You can add a background to the text layer and set a padding around it. And make sure that the right position unit value of the layers are in pixels, not percentage.
Best regards,
IsmaelThank you for your response!
Yeah, I ended up having to put separate layers for the background, as padding around the text seems to mess up in front end.
Perhaps you could give me a pointer towards whether I’m doing it wrong :)
I’ve attached screenshots of what I mean in the private content, it does the same in Safari and Firefox :)
Thanks a lot!
Hi,
Thank you for the update.
Edit the layers and in the preview box, look for the “Align Layers” dropdown. Set it to “Bottom Right” and adjust the layer position from there. You can hold shift + arrow button in your keyboard to move the layers 10px to any direction until you get the layer to the desired position. Repeat these steps for every layers. If you can’t get it to work as expected, post the login details in the private field so that we can help you adjust the slider.
Best regards,
IsmaelHi again,
Sorry about the delay, I’m abroad without access to reliable internet.
I know about the alignment and have tried to do so, but the problem I’m experiencing is regarding the padding around the text-boxes, as bottom- and right-padding seems to mess up in front-end, as illustrated in the screenshots in the private content of my earlier message :)
I’ve posted admin-login credentials in private content :)
If you have the chance, please check the front-end in both chrome and safari, as things end up looking quite different.
Thank you so much, have a great day!
Hi,
Welcome back! Thanks for the update.
The alignment of the layers looks about right on my end. Have you adjusted it?
// https://imgur.com/a/k3FFGsA
Best regards,
IsmaelHi Ismael,
Once again sorry about the delay from my part; still abroad 😊
Thank you for your help once more! But the issue I’m writing in about is centered around the paddings on the test-link I’ve provided in the private-data a few times now, and not the alignment, after I trie to combine the box and the text into a single layer as you suggested back in June 25th 😊
Hope it makes sense!
Thank you once again!
Hi,
Thank you for the update.
We added a unique class attribute to the text layers called “ls-text-block” and applied the following css code override the dynamic css properties that the slider is applying to the layers.
.ls-text-block { width: auto !important; height: auto !important; }Please delete cache before you check the page.
Best regards,
IsmaelHi again Ismael,
It worked flawlessly! The other issues I had was apparently tied to the way safari-clients downloaded one of my fonts inconsistently, but it’s taken care of.
Thank you so, so much!
Have a great day!
Hi,
Great, I’m glad that Ismael could help you out. Please let us know if you should need any further help on the topic or if we can close it.
Best regards,
Rikard
- You must be logged in to reply to this topic.