Bootstrap v4で画面幅に適応

現在グリッドシステムを使って、左９、右３で分けて画面を作っているんですが、携帯で見た時にそのままの割合で表示されるので、文字が改行だらけで分かりにくいので、画面が狭くなったら、右に表示していたものを下に置くようにしたいのですが、そのようにする事は可能でしょうか？

行動規範の内容に同意します

回答1件

ベストアンサー

的外れかもしれませんが、質問者さんが実現したいのは以下のような挙動でしょうか？

HTML
1<!DOCTYPE html>
2<html lang="ja">
3<head>
4    <meta charset="UTF-8">
5    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css">
6    <title>タイトル</title>
7    <style type="text/css">
8        .row {
9            background-color: #ff8ed0;
10        }
11
12        .col-md-3, .col-md-9 {
13            border: 1px solid black;
14        }
15    </style>
16</head>
17<body>
18<div class="container">
19    <div class="row">
20        <div class="col-md-9">
21            テキスト
22        </div>
23        <div class="col-md-3">
24            テキスト
25        </div>
26    </div>
27</div>
28<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
29<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/js/bootstrap.min.js"></script>
30</body>
31</html>