Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • August 4, 2015 at 7:58 pm #482929
    Workimage

    Hi,

    When my page is viewed landscape on an iPad or when resized in the browser the title of the icon box will over run the edge of the icon box.

    Can I change so the icon box’s will drop to 2 rows?

    At the moment I have 4 in a line.

    Thanks
    Alex

    August 4, 2015 at 9:28 pm #482981
    Basilis

    Hi Workimage!

    I have just checked and I can see 2 in a line. Can you please update with a screenshot?

    Cheers!
    Basilis

    August 4, 2015 at 9:42 pm #483004
    Workimage

    Hi,

    Thank you here is a screen shot:

    [IMG]http://i58.tinypic.com/k2kdhd.png[/IMG]

    Thank you
    Alex

    August 5, 2015 at 10:48 am #483201
    Rikard

    Hi,

    Please try the following in Quick CSS under Enfold–>General Styling:

    @media only screen and (max-width: 1200px) and (min-width: 768px) {
.responsive .av_one_fourth.first.el_before_av_one_fourth {
    width: 48% !important;
}
}

    You might have to edit the value 1200px depending on if you want it to go on two rows earlier or later.

    Thanks,
    Rikard

    August 5, 2015 at 1:49 pm #483313
    Workimage

    Hi Thanks but it now goes like this

    http://tinypic.com/r/2q9vwo7/8

    Anyway to make it keep the boxes even and in 2 lines?

    Thanks
    Alex

    August 6, 2015 at 4:40 am #483657
    Ismael

    Hi!

    Please remove the code then use this:

    @media only screen and (max-width: 1200px) and (min-width: 768px) {
.responsive .av_one_fourth.first.el_before_av_one_fourth, .responsive .av_one_fourth.first + .av_one_fourth + .av_one_fourth, .responsive .av_one_half.first + .av_one_fourth.el_before_av_one_fourth, .responsive .av_one_fourth.first + .av_one_fourth + .av_one_half, .responsive .avia-content-slider-inner .av_one_fourth.first {
    margin-left: 0%;
    clear: both;
}

.responsive .av_one_fourth.first.el_before_av_one_fourth, .responsive .av_one_fourth.first + .av_one_fourth, .responsive .av_one_fourth.first + .av_one_fourth + .av_one_fourth, .responsive .av_one_fourth.first + .av_one_fourth + .av_one_fourth + .av_one_fourth, .responsive .av_one_half.first + .av_one_fourth.el_before_av_one_fourth, .responsive .av_one_half.first + .av_one_fourth.el_before_av_one_fourth + .av_one_fourth, .responsive .avia-content-slider-inner .av_one_fourth {
    margin-left: 4%;
    width: 48%;
}
}

    Or you can decrease the title font size:

    @media only screen and (max-width: 1200px) and (min-width: 768px) {
#top .entry-content-wrapper h3 {
    font-size: 20px;
}}

    Cheers!
    Ismael

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