Viewing 17 posts - 1 through 17 (of 17 total)
  • Author
    Posts
  • #513544

    Hey. I have a problem with the display my page on the phone. Part of the page “contact” does not display correctly. Can I ask for help.
    Regards QeeQac

    #513793

    Hey qeeqac!

    use this code inside your Quick CSS field for your icons:

    @media only screen and (max-width: 767px) {
    .iconlist_icon.avia-font-entypo-fontello {
    width: 25px; 
    height: 25px;
    line-height: 25px;
    font-size: 15px;
    }}
    

    and this for the layout:

    @media only screen and (max-width: 767px) {
    ul.avia-icon-list.avia-icon-list-right.avia_animate_when_almost_visible.avia_start_animation {
    margin-left: -38px;
    }
    .avia-icon-list-container.avia-builder-el-72.avia-builder-el-no-sibling {
    margin-right: -38px;
    }}
    

    Cheers!
    Andy

    #514366

    Hey Andy.
    The problem is the incorrect display (sharing) icons. Below screen.
    Cheers!
    QeeQac

    #514502

    Hey!

    not sure what you mean, because I can’t see any sharing icons on your screenshots. Can you show us what you want to achieve please?

    Regards,
    Andy

    #514517

    It is a mistake in terms of contact icony :)

    #514539

    Hi!

    sorry, no idea what you mean … can you explain a little bit more precise what you want to achieve please? would be best to see on screenshots what you are trying to do, so we get a clear idea of which kind of CSS code you need.

    Regards,
    Andy

    #514546

    Problem is a strange display of icons and captions. icons and descriptions are cut and split in half. Similar icons in other places are displayed one at second.

    #514592

    Hi!

    I already provided you a code for this here. Adjust it as needed.

    Cheers!
    Andy

    #516219

    Hey Andy.
    The problem persists after entering the code. Here are two screenshots. The first shows the correct placement of icons. Such an arrangement is reflected in a higher post. In the second arrangement you can be seen by entering the code.
    Cheers!
    QeeQac

    #516318

    Hi!

    thanks for those screenshots, which made things really clear for us.
    Use this code in your Quick CSS code:

    div .av_one_half {
    width: 107%;
    }
    

    Cheers!
    Andy

    #516324

    Hey Andy.
    Thank you very much.It works :)

    Cheers!
    QeeQac

    #516328

    Andy. The problem appears now at full resolution.

    #516333

    Hi!

    oh yes, sorry. Add some media queries to my code from above:

    @media only screen and (max-width: 767px) { 
    div .av_one_half {
    width: 107%;
    }}
    

    This way it will only work on mobile devices (with a max resolution of 767px).

    Regards,
    Andy

    #516340

    Screen with a screen with higher resolution (more then 767px)

    #516379

    Hi!

    If you use my code from here, it will only work for devices with a max width of 767px. Don’t forget to remove this code.
    Clear browser cache and hard refresh.

    Regards,
    Andy

    #516381

    Hey Andy.
    Thank you very much! It works OK after clear browser cache.

    Cheers!
    QeeQac

    #516388

    glad we could help. Let us know in a new ticket if you have some more questions related to the theme. We are happy to assist you.

    Cheers!
    Andy

Viewing 17 posts - 1 through 17 (of 17 total)
  • You must be logged in to reply to this topic.