Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • August 4, 2022 at 6:43 pm #1360673
    blaircomm1

    I have 9 pages that all open within their own iFrame. This all works perfectly, except on medium tablets in portrait mode. This breaks at 2-colums and makes some images too small for the layout.

    I would like to set the breakpoint for just these 9 individual pages to go to one column below 1200 px — like it does on phones. I don’t know exacly how to do this though I am thinking it can be done by the post (page) number.

    For example, here is one of the pages: https://blaircomm.us/wp-admin/post.php?post=103516&action=edit&classic-editor=1

    I am assuming the page number is “103516” and can be targeted with this CSS somehow:

    @media only screen and (max-width: 1200px) {

    }

    I have 9 pages and would like to target them all in one CSS snippet to break to one column below 1200 px. How can I do this?

    Thanks.

    — Michael

    August 5, 2022 at 6:00 am #1360726
    Ismael

    Hey blaircomm1,

    Thank you for the inquiry.

    You can try the following css code to adjust the fullwidth breakpoint of the columns (1/2). Please add it in the Quick CSS field. 

    @media only screen and (max-width: 1200px) {

  /* Add your Mobile Styles here */
  .responsive #top .container .av-content-small, .responsive #top #wrap_all .flex_column.av_one_half, .responsive #top #wrap_all .av-flex-cells .no_margin {
    margin: 0;
    margin-bottom: 20px;
    width: 100%;
  }
}

    Best regards,
    Ismael

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