Почему класс flex работает не так, как задумано? - PullRequest
0 голосов
/ 16 июня 2019

Я пытаюсь следовать учебному пособию из laracasts (https://laracasts.com/series/laravel-vue-and-spas/episodes/2)) и пытаюсь создать гибкий div с основным и сторонним содержимым.

Класс flex не работает на Chrome или IE.

В настоящее время это выглядит так

https://ibb.co/NCcb12j

<!doctype html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">

        <<link href="https://fonts.googleapis.com/css?family=Open+Sans:400,700" rel="stylesheet">
        <link rel="stylesheet" href="/css/app.css">
        <title>Laravel</title>
    </head>
    <body>
       <div id="app">

           <div class="container mx-auto">
            <header class="mb-6">
                <h1>Laravel</h1>
            </header>

            <main class="flex">
                <aside class="w-1/5">
                    <router-link to="/home">Home</router-link>
                    <router-link to="/about">About</router-link>
                </aside>


                <div class="primary flex-1">
                    <router-view></router-view>
                </div>
            </main>



          </div>
       </div>


    </body>

<script src="/js/app.js"></script>
</html>

Это то, что я ожидаю, что это будет выглядеть https://ibb.co/tqBzCj5

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...