Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • October 23, 2015 at 2:03 am #523420
    Julie

    Hello!

    I am having problems with alignment of elements in tablet views for site http://everyoneorganized.com. Smaller screens are fine, it is the narrow tablet views (ipad mini and ipad) that are the problem:

    – On the home page under Who I Help, the right side of the icon labels in the second and third columns are being cut off
    – On the home page under What I Can Help With, the right side of the text in the top row, column 3 is being cut off, and so is the text in the bottom row, column 1
    – On the about page, the text does not wrap under the image, leaving a big white space on the left
    – The text above the right footer image is throwing off the alignment of the logos because it is a little bit longer than the others – is it possible to adjust padding between widgets or footer column width in this view only so it does not break onto a third line?

    Thanks in advance for your help!

    October 26, 2015 at 5:01 am #524622
    Rikard

    Hi Julie,

    Sorry for the late reply. I checked your front page but I couldn’t see any of the issues you are describing, could you post screenshots of the issues please? You can use a service like imgur.com and then link to the images here.

    Regards,
    Rikard

    October 26, 2015 at 8:20 pm #525164
    Julie

    Links to marked screenshots showing issues are below.

    Thanks!

    October 28, 2015 at 9:35 am #525952
    Ismael

    Hi!

    Add this in the Quick CSS field to increase the width of the one third column:

    @media only screen and (max-width: 989px) {
.responsive #top .container .av-content-small, .responsive #top #wrap_all .flex_column, .responsive #top #wrap_all .av-flex-cells .no_margin {
    margin: 0;
    margin-bottom: 20px;
    width: 100%;
}
}

    I think this will fix most of the issues.

    Best regards,
    Ismael

    October 29, 2015 at 12:56 am #526483
    Julie

    Wow, Ismael– brilliant! That fixes everything except the footer text above the right logo in the wide tablet view.

    Is there anything we can do about that one last thing?

    If not, let me know and I will tell the client we need to shorten that text.

    Thanks a million!

    October 29, 2015 at 3:16 pm #526831
    Ismael

    Hi!

    Great! Could you please provide a screenshot of the footer issue? I check it again and the logos are on top of one another.

    Best regards,
    Ismael

    October 29, 2015 at 3:22 pm #526840
    Julie

    They are stacked in narrow tablet view for sure, it is only in the wide view they are not – link to screenshot of wide view (1024px) using screenfly is below.

    If I need to request a screenshot from the client (who has a tablet), let me know.

    Thanks!

    October 31, 2015 at 3:46 am #527816
    Ismael

    Hi!

    Thank you for the screenshot. Please adjust the code above:

    @media only screen and (max-width: 1025px) {
.responsive #top .container .av-content-small, .responsive #top #wrap_all .flex_column, .responsive #top #wrap_all .av-flex-cells .no_margin {
    margin: 0;
    margin-bottom: 20px;
    width: 100%;
}
}

    Best regards,
    Ismael

    November 24, 2015 at 8:01 pm #541902
    Julie

    Worked perfectly, thank you!

    November 25, 2015 at 7:30 am #542157
    Rikard

    Hi,

    Great, glad we could help :-)

    Regards,
    Rikard

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