Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • February 13, 2018 at 5:02 pm #911776
    tonydobrevski

    Hi,

    I would like to put a 3/4 column in the middle of a page. Is this possible with a CSS?

    Thank you in advance!
    Best,
    Anton

    February 13, 2018 at 10:32 pm #911937
    Basilis

    Hey tonydobrevski,

    Can you show us with a screenshot please, what you want to make so we can understand?

    Best regards,
    Basilis

    February 13, 2018 at 11:00 pm #911966
    tonydobrevski
    This reply has been marked as private.
    February 13, 2018 at 11:25 pm #911981
    Guenni007

    well if you don’t be satisfied with 1/5-3/5-1/5
    i would use this nevertheless ( with space between columns) and gave to the sourrounding container a custom class
    i choosed here : oneeighth-threefourth-oneeighth

    and than i would adjust the width of the fifth-columns:

    
.oneeighth-threefourth-oneeighth .av_three_fifth { width: 9% }
.oneeighth-threefourth-oneeighth .av_three_fifth { width: 75% }
#top .oneeighth-threefourth-oneeighth .av-flex-placeholder { width: 3% }

    see here the difference on normal 5th columns and your desired aim

    https://webers-testseite.de/3-4th-on-center/

    February 14, 2018 at 5:41 am #912110
    Rikard

    Hi,

    Thanks for sharing @guenni007, did you try that out Anton?

    Best regards,
    Rikard

    February 14, 2018 at 7:24 pm #912426
    tonydobrevski

    Hi,

    Unfortunately, it doesn’t work for me. I also tried the solution mentioned here ( https://kriesi.at/support/topic/how-to-center-a-partial-width-column-in-avia-layout-builder/ ) but it also didn’t work. Is there anything else I could try?

    Best,
    Anton

    February 14, 2018 at 7:54 pm #912439
    Guenni007

    the link described above – you only wanted to have a container a bit smaller (75%) and centered?
    You dont want to place something left and right from it?

    than it will be easier to do this:

    place a 3/4 th column – give the custom class to it: three-fourth-centered

    do this to quick css:

    div.av_three_fourth.three-fourth-centered {
    position: relative;
    left: 50%;
    transform: translateX(-50%);
}

    see here https://webers-testseite.de/3-4th-centered/

    both methods will work if you read carefully

    February 15, 2018 at 1:03 am #912557
    tonydobrevski

    Hi,

    The last method worked perfectly! Thank you very much!

    Best,
    Anton

    February 15, 2018 at 6:26 am #912636
    Rikard

    Hi Anton,

    Great, glad you got it working. Please let us know if you should need any further help on the topic or if we can close it.

    Best regards,
    Rikard

    February 21, 2018 at 3:20 am #915153
    tonydobrevski

    Hi Rikard,

    Feel free to close the topic. Thank you for the help!

    Best,
    Anton

    January 21, 2019 at 9:19 pm #1056885
    Eric

    Hi Guenn,
    I tried your solution but I think I’m missing a step. I placed this into the quick CSS:
    /* THREE FOURTH CENTERED COLUMN */
    div.av_three_fourth.three-fourth-centered {
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    }

    Then added in the Edit Column Custom CSS Class field “three-fourth-centered”. Should the custom css class sit in the section color class field?

    January 23, 2019 at 3:32 am #1057549
    Ismael

    Hi,

    You should add that class attribute directly in the column itself. Have you tried that?

    Best regards,
    Ismael

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