global-width не работает с новой XY Grid фонда - PullRequest
Новая
       47

global-width не работает с новой XY Grid фонда

0 голосов
/ 28 апреля 2020

Я использую последнюю версию jointWP, которая использует Foundation 6.5. Я использовал гибкую сетку раньше без каких-либо проблем. Думаю, я мог бы попробовать новую сетку xy, так как она имеет несколько удобных функций. Но глобальная ширина не работает. В _settings.s css у меня есть такие: 

$global-width: 1150px;
$xy-grid: true;

И в стиле.s css: 

// Select the grid you would like to use
// @include foundation-grid;
// @include foundation-flex-grid;
@include foundation-xy-grid-classes;

// @include foundation-flex-classes;
@include foundation-visibility-classes;
@include foundation-float-classes;

В нижнем колонтитуле. php: 

<div class="inner-footer grid-x grid-margin-x grid-padding-x">

    <div class="small-12 medium-12 large-12 cell">
        <nav role="navigation">
            <?php joints_footer_links(); ?>
        </nav>
    </div>

    <div class="small-12 medium-12 large-12 cell">
        <p class="source-org copyright">&copy; <?php echo date('Y'); ?> <?php bloginfo('name'); ?>.</p>
    </div>

</div>

Но это становится полной шириной в браузере. Я не уверен, что мне здесь не хватает. В некотором роде также путают между foundation-grid и foundation-xy-grid-classes . Но я попробовал оба. Также лучше использовать новую сетку XY, чем Flex, мнения? Заранее спасибо.

1 Ответ

0 голосов
/ 01 мая 2020

Вы должны добавить контейнер, который также упоминается в документации. Сама сетка использует доступную ширину.

https://foundation.discourse.group/t/global-width-is-not-working-with-foundations-new-xy-grid/2381

Вам необходим .grid-container, см. https://get.foundation/sites/docs/xy-grid.html#grid -контейнер

См. https://github.com/foundation/foundation-sites/blob/b58d2354f54bb601f1b4ae7ee8536ac7ccfb18ba/scss/settings/_settings.scss#L859 $grid-container: $global-width;

...