-
Posts
-
Hey there
I was looking for a way to make a line of text — SNORE NO MORE — in one of my text blocks really big, and I found some advice in support ticket #559251 — So I added the CSS and it worked perfectly on my desktop, but not at all on my iPad or iPhone. The font family is different on my mobile devices and too big and gets all jumbled together.
Is there a way to accomplish what I’m trying to do that works across all devices?
Thanks as always.
-Rob
Hi again
I think I was able to accomplish what I wanted to do by using an png image instead of actual text…but I would like to know if you think that is the best approach or not. Does it slow down my load times, etc., or anything like that?
Thank you!
-Rob
Hi Rob,
I think that’s a good workaround, I think it wouldn’t affect your site’s load time since it will be only few kb. You can consider optimizing the image though, you can use: https://tinypng.com/ to compress it :)
Best regards,
NikkoHey Nikko
One other question, though. The way the medical demo theme is laid out, the easy slider at the top interacts with the Color Section that has (in my current site) the appointments, doctors, and services columns. I think from tinkering that it’s set to huge padding to facilitate the moving up and down of those columns responsively on different devices. When I change that padding to something smaller, it messes things up on my iPad and iPhone, etc.
So my question is, since there is now a big white space underneath my SNORE NO MORE png, due to the huge whitespace setting, is there a way to use css or something to make that bottom whitespace smaller? So that the following color section would be right underneath the png?
Hope that makes sense. THANKS!!!
Hi,
Try adding this css code in Quick CSS (located in Enfold > General Styling):
@media only screen and (max-width:1024px) { .home #av_section_1.avia-section-huge .content { padding-bottom: 50px !important; } }Just adjust the bottom padding as you see fit. Hope this helps :)
Best regards,
NikkoHi! One more question on this.
I previously was given this code to help position the caption in the easy slider properly, and it works great:
@media only screen and (min-width: 768px) and (max-width: 1024px) {
.slideshow_align_caption {
top: 5% !important;
}However, I’d also like to lower the text slightly in the Desktop version ONLY. Is there a way to move vertical alignment of the text on Desktops but simultaneously not mobile devices?
Gracias!
Hi,
Try changing that code to:
@media only screen and (min-width:1025px) { .slideshow_align_caption { top: 5% !important; } }Then adjust the 5% top position and that should do it :)
Best regards,
Nikko
- You must be logged in to reply to this topic.