i have big problem to align header text correct on mobile devices. The word "informacija pacientams", that means information for patients, is braking at the end and jumping into next row. If header-text is a bit longer, it is on mobile devices not readable any more. Any solutions, how can i fix that? Maybe some CSS codes? : )
unfortunately it didn't worked... ; / I was adjusting max width of screen and tried everything, but it still doesn't worked for me. ;/ So yesterday i was thinking, how could i make font size smaller and i luckily found font size options at theme menu. So i maked H1 font size smaller and now it works perfectly on mobile devices.
Yes, we can help you with some minor styling issues here on support. For more advanced styling issues, we also offer our payed customisation services. You can post it to this ticket or create a separate one, as you wish.
Hey Ortionthemessupport,
i have big problem to align header text correct on mobile devices. The word "informacija pacientams", that means information for patients, is braking at the end and jumping into next row. If header-text is a bit longer, it is on mobile devices not readable any more. Any solutions, how can i fix that? Maybe some CSS codes? : )
Thanks for helping!
Best regards from Lithuania,
Povilas Ancevicius
Hi Povilas,
You can adjust the heading font size on mobile. Here is a sample code to make it a bit smaller:
@media (max-width: 400px) { h1, .h1 { line-height: 36px; font-size: 30px; } }You can paste it to Theme Options -> Custom CSS.
In the above example: 400px is the max width of screen size on which this is applied, but you can change it as needed.
I hope this helps,
Andrej
OrionThemes
Hey Andrej,
unfortunately it didn't worked... ; / I was adjusting max width of screen and tried everything, but it still doesn't worked for me. ;/ So yesterday i was thinking, how could i make font size smaller and i luckily found font size options at theme menu. So i maked H1 font size smaller and now it works perfectly on mobile devices.
Thanks for your help!
Best regards,
Povilas
Hi,
Sometimes !important helps on the end. Please try this, if you would still like to change the font size on mobile:
@media (max-width: 600px) { h1, .h1 { line-height: 36px!important; font-size: 30px!important; } }Andrej
OrionThemes
YES! It worked well for me! Thanks! : )))
Ps. If i have more CSS questions, can i ask them here, or should i take new ticket?
Hi,
Yes, we can help you with some minor styling issues here on support. For more advanced styling issues, we also offer our payed customisation services. You can post it to this ticket or create a separate one, as you wish.
Kind regards,
Andrej
OrionThemes