Подскажите как подправить верстку если колонка с навигацией с левой стороны сделать фиксированной position fixed тогда контент, колонка с правой стороны залазит на левую колонку. Как их выровнять? Вот что на данный момент у меня
Спойлер (Отобразить)
CODE (html):
скопировать код в буфер обмена
скопировать код в буфер обмена
- <!DOCTYPE html>
- <html lang="ru">
- <head>
- <meta charset="utf-8">
- <title>Title</title>
- <meta name="description" content="">
- <meta http-equiv="X-UA-Compatible" content="IE=edge">
- <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
- <meta property="og:image" content="path/to/image.jpg">
- <link rel="shortcut icon" href="img/favicon/favicon.ico" type="image/x-icon">
- <link rel="apple-touch-icon" href="img/favicon/apple-touch-icon.png">
- <link rel="apple-touch-icon" sizes="72x72" href="img/favicon/apple-touch-icon-72x72.png">
- <link rel="apple-touch-icon" sizes="114x114" href="img/favicon/apple-touch-icon-114x114.png">
- <!-- Chrome, Firefox OS and Opera -->
- <meta name="theme-color" content="#000">
- <!-- Windows Phone -->
- <meta name="msapplication-navbutton-color" content="#000">
- <!-- iOS Safari -->
- <meta name="apple-mobile-web-app-status-bar-style" content="#000">
- <style>body { opacity: 0; overflow-x: hidden; } html { background-color: #fff; }</style>
- </head>
- <body>
- <div class="container">
- <div class="row">
- <header class="col-md-12 col-lg-12 header">
- <div class="col-md-12 col-lg-12">
- <div class="logo">
- <a href="#">
- <img src="img/logo.svg" alt="">
- Logo
- </a>
- </div>
- </div>
- </header>
- </div>
- <div class="row">
- <div class="col-md-12 col-lg-3 sidebar">
- Sidebar
- </div>
- <div class="col-md-12 col-lg-9 content">
- <p><strong>Далеко-далеко</strong> за словесными горами в стране, гласных и согласных живут рыбные тексты. Пустился снова, силуэт сих снова не коварный за языкового текста до рекламных, агенство возвращайся, буквенных жизни это, первую переулка правилами?</p>
- <p>Наш, приставка страна единственное большой, власти, злых, взобравшись семь рот он алфавит осталось вершину курсивных сих всемогущая буквенных предупредила залетают необходимыми эта но вдали имеет ты? Предупреждал повстречался, но которое!</p>
- <p>Злых, знаках свою. Выйти по всей рукописи запятой дороге маленький дорогу, все вопроса переулка необходимыми точках повстречался текстов наш приставка одна над страна последний, за имеет ты всемогущая предложения рот скатился.</p>
- <p>
- lorem5000
- </p>
- </div>
- </div>
- </div>
- <link rel="stylesheet" href="css/main.min.css">
- <script src="js/scripts.min.js"></script>
- </body>
- </html>