Constrict size of a Grid Row

sorry Ismael – a grid-row with .container ? ;)
The Grid-Row itself got that class: .container_wrap
or do you see more info about the page – is it a grid-row he is talking about?

i do not see his page – but even with that class adjustment he will have trouble if .main_color is set to something different than white.
my solution for that is to wrap the grid-row in a container that has the attributes of a color-section.
Just give the custom-class: grid-notfull to the grid-row element.
The additional class – added by the script color1 is for custom color if you would like to deviate from the default setting.

See example page – https://webers-testseite.de/grid-row-alb/

• on top normal grid-row
• in the middle : grid-row with that custom-class : grid-notfull
• on the bottom : grid-row with only css setting ( set the .container_wrap to max-width )

here is the little snippet for child-theme functions.php:

function grid_layout_notfull(){
?>
<script>
(function($){
    $('.av-layout-grid-container.grid-notfull' ).wrap( '<div class="main_color notfullsize color1"></div>');
    $('.notfullsize').css({"clear": "both", "width": "100%" , "float": "left" , "position": "static" , "min-height": "100px" });
    $('.grid-notfull').css({"max-width": "1310px", "margin": "0 auto" , "padding": "0 25px"});
})(jQuery);
</script>
<?php
}
add_action('wp_footer', 'grid_layout_notfull');

adjust the grid-notfull class to your settings ( your container generall setting on Enfold Options)
The padding has to be adjust too

so you got a different Enfold than me?
You see on the example page that it works?
have you a link for me to see what is the issue?

if these are only #footer flex_columns – try:

@media only screen and (min-width: 768px) { 
  #footer .container {
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
    align-items: flex-start;
    max-width: 1600px;
  }

  #footer .container::after {
    display: none;
  }

  #footer .container .flex_column {
    width: unset;
    flex: 1 1 auto;  /*** the first "1" and the auto value has the possibility that column 2 can grow bigger than the others - else 30%  ***/
    margin: 0 0 20px;
  }

  #footer .container .flex_column:nth-of-type(2) {
    padding: 0 20px;
  }
}

adjust the wanted column-width with the flex setting
and adjust the max-width of the container to your needs

• This reply was modified 3 years, 8 months ago by Guenni007.