Question

我有一个fiddle，右边和左边栏。引导容器类适用于带有文本环绕的左侧栏以及所有这些。但右侧边栏不能正常工作。文本被隐藏在它下面并且没有正确包裹。我也想在某些媒体点隐藏侧边栏，并希望容器在这一点上正常工作......

有人可以给我一些关于让我的右侧边栏和容器相互正常工作的指示吗？

<!doctype html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>sidebar test</title>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" crossorigin="anonymous">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" crossorigin="anonymous"></script>
<style>
    .sidebar-fixed-left {
      width: 200px;
      position: fixed;
      border-radius: 0;
      height: 100%;
    }

    .sidebar-fixed-left + .container {
      padding-left: 220px;
    }

    .sidebar-fixed-right {
      width: 200px;
      position: fixed;
      border-radius: 0;
      height: 100%;
      right: 0;
    }

    .sidebar-fixed-right + .container {
      padding-left: 220px;
    }

</style>
</head>

<body>
<div class="navbar-inverse sidebar-fixed-left">
</div>
<div class="navbar-inverse sidebar-fixed-right">
</div>
<div class="container">
 <div class="row">
   <h2>Left and Rigth sidebars (Fixed)</h2>

   <p>Left and Right sidebars</p>
 </div>
</div>  
</body>
</html>

右侧边栏不想使用Bootstrap .container class

0 个答案: