Как расположить контент относительно колоночной сетки?

Question

Здесь subheader "прилепился" к левому краю экрана. Чтобы посмотреть сайт в нормальном виде, приходится двигать ползунок браузера к центру. Почему все так расположилось?

* {
    font-family: 'Roboto', sans-serif;
}

nav {
    width: 1949px;
    height: 50px;
    background-color: #212121;
}

.menu {
    display: flex;
    justify-content: space-between;
    padding: 13px 70px;
    margin: 0;
    list-style-type: none;
}

.menu .menu_link {
    color: #ffffff;
    font-size: 15px;
    font-weight: 300;
}

.menu .menu_item {
    border-right: 2px dotted black;
    padding-right: 28px;

}

.subheader {
    height: 84px;
    background-color: rgba(0,0,0, .6);

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;700&display=swap" rel="stylesheet">
    <link rel="stylesheet" href="css/bootstrap-reboot.min.css">
    <link rel="stylesheet" href="css/bootstrap-grid.min.css">
    <link rel="stylesheet" href="css/style.css">
</head>
<body>

    <header>
        <nav>
        <div class="container">
                <ul class="menu">
                    <li class="menu_item"><a href="#" class="menu_link">Главная</a></li>
                    <li class="menu_item"><a href="#" class="menu_link">Со своим автомобилем</a></li>
                    <li class="menu_item"><a href="#" class="menu_link">На автомобиле компании</a></li>
                    <li class="menu_item"><a href="#" class="menu_link">Требования</a></li>
                    <li class="menu_item"><a href="#" class="menu_link">Контакты</a></li>
                    <li class="menu_item"><a href="#" class="menu_link">Оставить заявку</a></li>
                </ul>
        </div>
    </nav>
    <div class="subheader">
        <div class="container">
           <div class="row">
            <div class="col-md-4 offset-md-1"> fuckuman</div> 
            <div class="col-md-2 offset-md-2">

            </div>
            <div class="col-md-2">
                 </div>
        </div>
    </div>
           </div>
    </div>
    </header>
    
</body>
</html>

БЛОГ НА HUSL

Как расположить контент относительно колоночной сетки?

Ответы (0 шт):