是否可以使用 position:fixed 或替代它并让它保持自然流动？

Question

我有一个固定的侧边栏：

#sidebar {
    background-color: #eaeaea;
    width: 18.5vw;
    height: 100vh;
    position: fixed;
    align-items: stretch;
}

因为它的位置：固定；它不在自然流中，这意味着如果我不给主要内容相对于侧边栏的宽度并将其浮动/定位正确，那么主要内容将出现在它的前面/后面，如下所示：(@ 987654321@).

这很难处理此内容，因为它是一个 Wordpress 插件模板，其中包含更多模板，其中包含更多模板但没有实际内容，并且我尝试添加到主模板的任何容器都不会显示（在这种情况下至少在这个特定页面上）。它确实适用于不同的页面和模板：(http://picpaste.com/pics/screenshot1-BPi0QsIX.1490873805.png)。

我的问题是是否可以在不离开自然流动的情况下将侧边栏固定在适当的位置，这样我就不必为所有主要内容指定相对宽度 - 主要内容并不总是组合在一起，我最终不得不针对许多单独的元素来执行此操作，如果引入新元素，这在未来可能会出现问题。

这里是看不到容器的模板代码的开头（称为.match-wrapper）：

<?php
/**
 * The Template for displaying job details
 *
 * Override this template by copying it to yourtheme/simple_job_board/single-jobpost.php
 *
 * @author      PressTigers
 * @package     Simple_Job_Board
 * @subpackage  Simple_Job_Board/Templates
 * @version     1.1.0
 * @since       2.2.0
 * @since       2.2.3   Enqueued Front Styles & Revised the HTML structure.
 * @since       2.2.4   Enqueued Front end Scripts.
 * @since       2.3.0   Added "sjb_archive_template" filter.
 */
get_header(); ?>

<img src = '<?php bloginfo('template_directory'); ?>/images/nieuwspagina-header.png' class="not-front-page-header" />

<div class="match-wrapper">

<?php
ob_start();
global $post;

/**
 * Enqueue Frontend Scripts.
 * 
 * @since   2.2.4
 */
do_action('sjb_enqueue_scripts');

/*code continues....

非常感谢。

Answer 1

是的...弹性框是一种方式 - 这个问题与你的类似

Flexbox responsive layout with multiple sidebars