Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • April 7, 2018 at 12:28 am #938460
    davidkfry

    I’ve encountered this issue a few times where we have content in grid rows or equal height cells. When the content is aligned to the top, if a CTA button is the last item, people think it looks sloppy because any variability in copy above the buttons means the buttons don’t line up. Is it possible to attach a button to the bottom of a cell in an otherwise top-aligned cell.

    April 9, 2018 at 7:46 am #938992
    Victoria

    Hey davidkfry,

    Here is the code you can put in Enfold > General Styling > Quick Css,  if it does not work, put into themes/enfold/css/custom.css

    
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  #top #wrap_all #av-layout-grid-1 .av-inherit-size .av-special-heading-tag,  
  #top #wrap_all #av-layout-grid-2 .av-inherit-size .av-special-heading-tag {
    font-size: 18px;
  }
}

@media only screen and (min-width: 768px) {
  #av-layout-grid-1 .no_margin.av_one_fifth {
    min-height: 412px;
    padding: 10px !important;
  }

  #av-layout-grid-1 .no_margin.av_one_fifth .flex_cell_inner {
    min-height: 352px;
  }

  #av-layout-grid-1 .avia-button-wrap.avia-button-center.bottomstuck {
    position: absolute;
    bottom: 0;
    width: 100%;
  }

  #av-layout-grid-2 .no_margin.av_one_fifth {
    min-height: 412px;
    padding: 20px 10px !important;
  }

  #av-layout-grid-2 .no_margin.av_one_fifth .flex_cell_inner {
    min-height: 352px;
  }
  #av-layout-grid-2 .avia-button-wrap.avia-button-center {
    position: absolute;
    bottom: 0;
    width: 100%;
  }
}

    If you need further assistance please let us know.

    Best regards,
    Victoria

    April 9, 2018 at 2:36 pm #939241
    3dika

    Hi Victoria, I have the same problem that Davidkfry.
    It does not work either in the “quick css” or in “themes / enfold / css / custom.css”

    April 9, 2018 at 7:55 pm #939380
    davidkfry

    Thanks Victoria, that worked great.


    @Hirudika    , this will work but is dependent on two things: the height of elements within the grid row, and the order of the grid rows. So you’ll notice in the code she provides min-height separately for each grid row (#av-layout-grid-1 and #av-layout-grid-2).

    April 10, 2018 at 5:39 am #939567
    Rikard

    Hi @davidkfry,

    Great, glad we could help :-)


    @Hirudika    , please open a new thread if you should have any further problems.

    Best regards,
    Rikard

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