Viewing 14 posts - 1 through 14 (of 14 total)
  • Author
    Posts
  • March 30, 2016 at 9:35 pm #605477
    mcraig77

    Ahoy,

    I’m trying to reduce the space between these sections.

    I would like the call us section (column4) more right and the Mailing address section (column5) more left.

    both already have Custom Css Class

    please advise

    March 30, 2016 at 10:14 pm #605499
    Basilis

    Hi mcraig77

    please try

    div .av_one_third { margin-left: 2% !important; }

    and let us know if that works for what you need to do.
    Thanks a lot

    Best regards,
    Basilis

    March 30, 2016 at 11:29 pm #605546
    mcraig77

    AHoy –

    I added that code to quick css and it didnt work

    div .av_one_third { margin-left: 2% !important; }

    Please advise

    • This reply was modified 8 years ago by mcraig77.
    March 31, 2016 at 7:31 am #605679
    Basilis

    Hey!

    can u please share access to your web site?

    Best regards,
    Basilis

    March 31, 2016 at 7:47 am #605688
    mcraig77

    Below

    March 31, 2016 at 4:12 pm #606004
    Vinay

    Hi!

    We have added custom css and class name box1 and box3 to target the boxes and move them closer.

    
@media only screen and (min-width: 769px) {
.box1{
transform:translateX(8vw);
}
.box3{
transform:translateX(-8vw);
}
}}

    Best regards,
    Vinay

    • This reply was modified 8 years ago by Vinay.
    March 31, 2016 at 6:28 pm #606101
    mcraig77

    By adding that change my contact form is now messed up… It should be on the right hand side

    Please advise

    April 1, 2016 at 6:52 am #606501
    Ismael

    Hey!

    Adjust the left and right position of the columns:

    .column4.box1 {
    left: -10%;
}

.column5.box3 {
    right: -10%;
}

    Use css media queries to adjust the value on different screen sizes.

    Regards,
    Ismael

    April 1, 2016 at 7:21 pm #606825
    mcraig77

    Hi, that code doesn’t fix things… It just puts the top area back but leaves the contact area awkward.

    Screenshot 1

    This is what im trying to achieve. I need the the top section to look like this screenshot 2 of the bottom section. Under that I need the Contact us for more info: section to look like this screenshot 3

    please advise

    April 4, 2016 at 4:56 am #607335
    Ismael

    Hi!

    Did you remove the first suggested code? The code above should move the 1st and 3rd column.

    Cheers!
    Ismael

    April 4, 2016 at 5:26 am #607347
    mcraig77

    Hi,

    The code here moves the columns fine – the code you provided didn’t work correctly

    @media only screen and (min-width: 769px) {
.box1{
transform:translateX(8vw);
}
.box3{
transform:translateX(-8vw);
}
}}

    But the issue is that the bottom portion under that area screenshot 1 is not formatting correctly. This i how it is in the page builder… as you can see the front end isnt matching up with the page builder… screenshot 2

    April 4, 2016 at 10:06 am #607468
    Ismael

    Hey!

    Please remove that code and this one:

    div .av_one_third {
    margin-left: 2% !important;
}

    The code in #606501 should achieve this:

    https://www.dropbox.com/s/3o9umtlkzas27hn/Screenshot%202016-03-30%2012.32.41.png?dl=0

    Regards,
    Ismael

    April 4, 2016 at 8:52 pm #607852
    mcraig77

    I figured it out, thanks!

    April 5, 2016 at 6:49 am #608066
    Rikard

    Hi,

    Great, glad you got it working :-)

    Best regards,
    Rikard

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