Black Friday Sale! Get up to $40 off GP Premium!Learn more

[Resolved] Make some part of content not responsive.

Home Forums Support Make some part of content not responsive.

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #444976
    Leon

    Hi Tom,

    I’m pretty happy with my laptop layout for my home page.

    However, on mobile, since it’s responsive, the home page becomes very long vertically and it’s not so easy to view content. I’m wondering if there is a way to make some part scroll horizontally instead of displaying them in a vertical order.

    In general: I want to make my homepage shorter on mobile. I’ve summarized my thoughts with the below pic. I hope you can read it. 🙂

    If you could help give my website a visit both on desktop and mobile: https://interpreterdatabase.com, you may understand my problem better. (I apologize for making it difficult. I still need to learn about Photoshop)

    Before asking you, I’ve tried css: overflow-x:auto; for that second column. But it works if there is only one table in the div. But as of now, since there are three pictures, it’ll not show a horizontal scroll bar, instead, the pictures will display vertically.

    Thank you in advance.
    Best regards
    Leon

    #444981
    Leon

    Thi is the code Im using for the first section: The short codes that begin with [su] are by Shortcodes Ultimate plugin that does pretty similar thing as you have with Lightweight Grid Columns I guess.

    [su_row]
    [su_column size="1/4"]
    <h1 style="text-align: center; color: white;"><strong>Chinese interpreter China translator.</strong></h1>
    [/su_column]
    [su_column size="1/2"]
    <div style="overflow-x: auto;">
    <div style="float: left; margin-right: 15px; text-align: center;">
    <a href="https://player.vimeo.com/video/228325811" data-featherlight="iframe" data-featherlight-iframe-allowfullscreen="true" data-featherlight-iframe-width="400" data-featherlight-iframe-height="500"><img class="aligncenter wp-image-2483" src="http://interpreterdatabase.com/wp-content/uploads/2017/08/Jayson-Testimonial-on-Interpreter-Leon.jpg" alt="" width="175" height="227" /></a>
    <span style="color: #ffffff;"><a style="color: #ffffff;" href="http://interpreterdatabase.com/profile/7">Leon</a></span>
    </div>
    
    <div style="text-align: center; float: left; margin-right: 15px;">
    <a href="https://player.vimeo.com/video/228325690" data-featherlight="iframe" data-featherlight-iframe-allowfullscreen="true" data-featherlight-iframe-width="400" data-featherlight-iframe-height="500"><img class="aligncenter wp-image-2485" src="http://interpreterdatabase.com/wp-content/uploads/2017/08/Testimonial-on-Interpreter-Lucy-Lan.jpg" alt="" width="175" height="227" /></a>
    <p style="text-align: center;"><span style="color: #ffffff;"><a style="color: #ffffff;" href="http://interpreterdatabase.com/profile/164">Lucy</a></span></p>
    </div>
    
    <div style="text-align: center; float: left; margin-right: 15px;">
    <a href="https://player.vimeo.com/video/228323945" data-featherlight="iframe" data-featherlight-iframe-allowfullscreen="true" data-featherlight-iframe-width="400" data-featherlight-iframe-height="500"><img class="aligncenter wp-image-2484" src="http://interpreterdatabase.com/wp-content/uploads/2017/08/Testimonial-on-Interpreter-Christin.jpg" alt="" width="175" height="227" /></a>
    <p style="text-align: center;"><span style="color: #ffffff;"><a style="color: #ffffff;" href="http://interpreterdatabase.com/profile/367">Christin</a></span></p>
    </div>
    </div>
    [/su_column]
    [su_column size="1/4"]
    [upme_search show_combined_search=no filters=language,familiar_industries,city_live_in use_in_sidebar=yes]
    [/su_column]
    [/su_row]
    #445298
    Tom
    Lead Developer
    Lead Developer

    I’m not sure most users would think to scroll horizontally. People are pretty used to scrolling vertically, even if the page is long.

    Alternatively, you could look into a carousel plugin.

    #445486
    Leon

    Hi Tom,

    I guess you are right. I’ll stick with it as of now.

    Thanks
    Leon

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