如何在侧栏上获得全宽，同时保持右侧的右栏？

Question

我只想把一切都放在右边。问题是第二个右侧的div总是位于左侧div的底部，如果我将高度100％放在左侧div上，那么移动版本很糟糕。

这是我的代码和CSS。我想保留左边的菜单，下面没有任何内容，右边的这张卡片＆＃39;这是浮动的。

<div class="feed-wrapper">
    <div class="container">
        <div class="col-md-3">
            <div class="feed-left">
                <ul>
                    <li>Laracasts</li>
                    <li>Modern web</li>
                    <li>Css daily</li>
                </ul>
            </div>
        </div>
        @foreach($feeds as $feed)
            <div class="col-md-9">
                <div class="feed-card">
                    <div class="feed-card-left" style="background-image: url({{ $feed->image }})">
                        {{-- <img src="{{ $feed->image}}"> --}}
                    </div>
                    <div class="feed-card-right" >
                        <h3>{{ $feed->title }}</h3>
                        <p>{{ str_limit($feed->description, 100) }}</p>
                        <hr>
                        {{ $feed->resource }}
                    </div>
                </div>
            </div>
        @endforeach
    </div>
</div>

和CSS

.feed-wrapper {
    background: #EEF2F3;
}

.feed-left {
    margin: 20px 0;
    border-radius: 10px;
    background: white;
    display: flex;
}

.feed-left {
    padding: 10px;
}
.feed-left ul {
    list-style-type: none;
}

.feed-card {
    background: white;
    margin: 20px 0px;
    display: flex;
    border-radius: 5px;
}

.feed-card-left  {
    width: 25%;
    background-position: center;
    background-size: 350px;
    background-repeat: no-repeat;
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
}

.feed-card-right {
    margin-left: 15px;
    float: right;
}

Answer 1

可能将侧边栏放在显示的内容div中：flex;