Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • November 16, 2017 at 3:32 pm #877577
    NewPage

    Hello I’m using the tables of the theme builder.
    On mobile they break by coulumn which makes not very much sense with the contend.

    Is there any other option to style how the tables are breaking?

    Thank in advance

    November 18, 2017 at 7:51 am #878381
    Nikko

    Hey NewPage,

    I would suggest using only Use Table for Tabular Data, then for the full table (for desktop) set it to hide on mobile and create 3 tables with 2 columns (heading & value) which will be hidden on desktop and shown on mobile.
    Hope this helps. :)

    Best regards,
    Nikko

    November 19, 2017 at 10:51 pm #878883
    NewPage

    Hey Nikko,

    thank you for the great advice. This will solve some of my other styling issues with mobile as well.

    Best regards,

    Daniel

    November 20, 2017 at 5:12 am #878965
    Nikko

    Hi Daniel,

    Glad that we could help. Let us know if you need more assistance :)

    Best regards,
    Nikko

    November 21, 2017 at 5:33 pm #879835
    NewPage

    Hello Nikko,
    I have one more question. The contend of the boxes below the main pictures are not scaling on iPad size (768×1024) correctly. But on mobile everything is fine.
    Is it possible to change the scale of the element like on mobile while the size main screen is from the iPAD.

    Your Advice with the several options seems not to work in this case.

    Thank you,

    Daniel

    November 22, 2017 at 4:35 am #880027
    Nikko

    Hi,

    I would suggest adding an id for sections that have those columns, for example heading-col then go to Quick CSS (located in Enfold > General Styling) and add this css code:

    @media only screen and (max-width:959px) {
  .responsive #top #wrap_all #heading-col .flex_column {
    margin: 0 0 20px;
    width: 100% !important;
  }
}

    Make sure to add that heading-col id since it will only affect sections that has that id. Also just to make your columns look better, add this css code in QUick CSS:

    #top .flex_column_table {
    border-collapse: collapse;
}

    Please add at the top of the first code I gave. Hope this helps :)

    Best regards,
    Nikko

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