Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • October 20, 2015 at 2:32 am #521291
    Archie

    Hi guys

    My website is http://mycybergenie.com/

    Right below the top section, you will see two items, text to the left, and an image to the right. These are two 1/2 Layout Elements inside a color section.

    layout

    Currently they do not center when viewing on different browser resolutions (responsive). Is there any way we can insert a code to make them center vertically and horizontally automatically when viewed on various browser resolutions?

    October 20, 2015 at 6:50 am #521397
    Rikard

    Hi hackoffseries,

    I’m not sure what you mean by that, it looks centered on my end on all resolutions. Could you post another screenshot highlighting the problem on smaller screens please?

    Thanks,
    Rikard

    October 21, 2015 at 12:31 am #522094
    Archie

    Hi Rikard

    Thanks for the response. What I meant was to center them both horizontally and vertically. At the moment they are only centered horizontally but no centering vertically.

    Here are two more screenshots to demonstrate what I mean.

    responsive 1

    responsive 2

    Noticed how both elements all move to the top instead of in the middle (vertical alignment)? Is there any way we can modify this so they are “center center”?

    October 21, 2015 at 10:44 pm #522579
    Andy

    Hey!

    try this code inside of Quick CSS field: 

    .flex_column.av_one_half.flex_column_div.av-zero-column-padding.avia-builder-el-8.el_after_av_one_half.el_before_av_hr {
margin-top. 35%;
}

    and adjust as needed.

    Cheers!
    Andy

    October 21, 2015 at 11:07 pm #522589
    Archie

    Thanks Andy will try now

    October 21, 2015 at 11:17 pm #522594
    Archie

    Hi Andy

    Unfortunately it does seem to do the trick. The items still stick to the top (I don’t see any top padding). Can you help? I’ve provided some log in details for you. Thanks!

    October 21, 2015 at 11:28 pm #522599
    Basilis

    Hi!

    Please replace Andys code with

    .flex_column.av_one_half.flex_column_div.av-zero-column-padding.avia-builder-el-8.el_after_av_one_half.el_before_av_hr {
margin-top: 35%;
}

    he have had a small typo

    Best regards,
    Basilis

    March 24, 2016 at 3:29 am #602862
    Archie

    Thanks Basilis, Andy and Rikard! Kindly close this support ticket now.

  • Author
    Posts
Viewing 8 posts - 1 through 8 (of 8 total)
  • The topic ‘Vertical and horizontal center of 1/2 Layout Elements’ is closed to new replies.