Viewing 16 posts - 1 through 16 (of 16 total)
  • Author
    Posts
  • May 15, 2015 at 5:21 am #444736
    rpl_admin

    Hi there,

    We have two Xlarge buttons on the Home page. They look fine on all screens other than 768. How can we get them side by side on this screen size? (We have used 1/4 x 4 layout, and not 1/2 x 2, because if we do not the buttons are too far apart on larger screen sizes).

    May 17, 2015 at 2:05 pm #445397
    Andy

    Hi rpl_admin!

    try this code:

    @media only screen and (min-device-width: 768px) and (max-device-width: 768px) {
.avia-button-wrap.avia-button-center.avia-builder-el-9.avia-builder-el-no-sibling {
top: -104px;
}}

    and adjust as needed by yourself.

    Regards,
    Andy

    • This reply was modified 9 years, 7 months ago by Andy.
    May 17, 2015 at 2:55 pm #445401
    rpl_admin

    Hi Andy,

    Thanks for your mail but that doesn’t seem to have helped. I actually noticed that the behaviour happens below 990px, and then at 767 the right button goes under the left button, but we’d actually like them side by side down to about 600.

    Robert

    May 18, 2015 at 4:48 pm #445817
    Ismael

    Hi!

    Try to add this:

    @media only screen and (min-width: 768px) and (max-width: 989px) {
.responsive #av_section_1 .av_one_fourth.first + .av_one_fourth + .av_one_fourth + .av_one_fourth, .responsive #av_section_1 .av_one_fourth.first {
  display: none;
}

body #av_section_1 .flex_column.av_one_fourth {
  margin-top: 0;
  clear: none;
}}

    Edit the color section then add a unique id in the Section ID field. Use “custom-section” for example. Replace the #av_section_1 selector with the section id #custom-section.

    Best regards,
    Ismael

    June 1, 2015 at 1:37 pm #452503
    rpl_admin

    Hi there,

    I’m afraid we haven’t resolved this issue. The buttons positions are not side by side 990 down to 767. Any further help very much appreciated.

    Many thanks,

    Robert

    June 3, 2015 at 8:24 am #453598
    Basilis

    Hi!

    I have loaded your web site, and I can not find the code we provided in there. Have it been removed?

    Best regards,
    Basilis

    June 3, 2015 at 9:13 am #453638
    rpl_admin

    Hello Basilis,

    No, it’s still there in the Quick CSS.

    Robert

    June 3, 2015 at 4:15 pm #453895
    Yigit

    Hey!

    Do you mind creating a temporary admin login and posting it here privately so we can look into it?

    Best regards,
    Yigit

    June 4, 2015 at 1:41 am #454167
    rpl_admin
    This reply has been marked as private.
    June 5, 2015 at 6:04 pm #455209
    Andy

    Hi!

    Please review your website now, because I implemented this code in your Quick CSS:

    @media only screen and (min-width: 768px) and (max-width: 989px) {
.responsive .av_one_half.first + .av_one_fourth, .responsive .av_one_half.first + .av_one_fourth + .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_fourth.first + .av_one_fourth + .av_one_half {
margin-top: -76px;
left: 270px;
}}

    and it looks fine to me now:

    Don’t forget to clear browser cache.

    Cheers!
    Andy

    June 8, 2015 at 1:56 am #455688
    rpl_admin

    Hello Andy,

    Many thanks for your work on this. Unfortunately, the buttons now render off-centre (too far to the left) between 768 and 990.

    You still have access or if you can tell what we need to modify.

    Thanks again,

    Robert

    June 8, 2015 at 7:24 pm #456302
    Andy

    Hi!

    please adjust by yourself. Just change the value of “left”, for example to: 

    @media only screen and (min-width: 768px) and (max-width: 989px) {
.responsive .av_one_half.first + .av_one_fourth, .responsive .av_one_half.first + .av_one_fourth + .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_fourth.first + .av_one_fourth + .av_one_half {
margin-top: -76px;
left: 360px;
}}

    Hope this helps.

    Cheers!
    Andy

    June 9, 2015 at 8:57 am #456520
    rpl_admin

    Hello Andy,

    That doesn’t work. It just places the buttons on two ‘rows’ again. Please help, we need to launch this site very soon and this will be the first page most visitors will see.

    Thanks,

    Robert

    June 10, 2015 at 5:22 pm #457389
    Andy

    Hey!

    I thought this is what you want? like showing in my screenshot from my previous post. So I am confused and don’t know what you want to achieve now. Please send us a mockup showing exactly what you are trying to achieve. If you are in a hurry feel free to hire a freelancer for this job.

    Best regards,
    Andy

    • This reply was modified 9 years, 6 months ago by Andy.
    June 11, 2015 at 2:32 am #457583
    rpl_admin

    Hi Andy,

    There’s been some confusion because we now have 4 buttons. Someone has used a ‘grid’ under the original buttons.

    But anyway, what we want is for the two buttons to be side by side (perfectly aligned & nicely spaced) on all screen sizes down to 480. Below 480, it’s better to have the “teachers’ button below the ‘test takers’ button.

    Thanks again,

    Robert

    June 12, 2015 at 4:00 pm #458437
    Andy

    Hey!

    I am sorry, but we can only provide you with basic support here, as written in our support policy. If you need some customizations for your website hire a freelancer. I still have no idea what you mean with “perfectly aligned & nicely spaced” and I already asked for a mockup/screenshot showing exactly what you need.

    My answer from here:
    https://kriesi.at/support/topic/buttons-position-ipad-portrait/#post-455209
    seems to provide you with what you need. Please adjust it as needed by yourself.

    Regards,
    Andy

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