-
Posts
-
Dear support team
I don’t get the desired result in the view of the timeline on the cell phone and the tablet in portrait format: https://my-visionguide.de/home/#lapse
The text is only displayed in a small column on the mobile phone, as well as in the view of the tablet in portrait format. the padding on the right is way too big, but I don’t know how to change it only for the mobile phone and the tablet portrait format:
Mobile view: https://my-visionguide.de/support/timeline-mobile-1.jpg
Portrait tablet view: https://my-visionguide.de/support/timeline-tablet-hoch.jpegWhat can I do to make it easy to read on mobile phones and tablets in portrait format?
Best regards Diana
I was able to solve the problem with the timeline and the large border on the right:
there was a css script that centered the timeline that caused problems here. Therefore I have now only set this for larger screens with the following CSS:
@media only screen and (min-width: 1224px) {
#mid-timeline .avia-timeline-vertical.av-milestone-placement-left .av-milestone-content-wrap {
width: 50%; }
}Now the padding on the right is no longer available.
HOWEVER, there is another problem on the mobile version:
The title (= date of the milestone) of the timeline is displayed on the mobile phone with a huge line spacing and the words are also cut off: see screenshot: https://my-visionguide.de/support/timeline-schrift.jpg
How can I get the whole title to be read on the cell phone and the line spacing a bit smaller?
Best regards Diana
Hi,
Thanks for your patience and the link to your site please try this css:@media only screen and (max-width: 450px) { #top #wrap_all .all_colors h2.av-milestone-date { font-size: 35px; line-height: 1em; } #top h2.av-milestone-date strong { font-size: 20px; } }After applying the css, please clear your browser cache and check.
this is the expected results:
Best regards,
Mike
- You must be logged in to reply to this topic.