Question

我是网页设计的新手，我一直在为此找到答案而无法找到答案。

所以我想在页面的侧面添加一个固定的垂直导航栏，所以我用#everything整个页面并添加了50 px的左边距，这样就有了足够的空间来制作吧台。但是，当我这样做时，文本不适合其父级的宽度。它似乎根据页面大小调整大小，而不是根据容器的大小调整大小。

我该怎么做才能使文字溢出，而是适应其容器的大小？

＆＃13;

#everything{
margin-left:50px;
}

＆＃13;

        <div id='everything'>   

        <div class='row'>
            <div class='col-sm-6'>
              <p>text long enough to make a paragraph</p>
              <p>text long enough to make a paragraph</p>
            </div>
            <div class='col-sm-6'>
              <p>text long enough to make a paragraph</p>
              <p>text long enough to make a paragraph</p>         
            </div>
          </div>
       
       </div>

＆＃13;

所以我开始使用bootstrap并且这样做了所以我在页面上有响应段落。我想在页面的侧面添加一个固定的导航栏，所以我用#all id包装了整个页面

Answer 1

也许你正在寻找的东西

＆＃13;

#bar {
  width: 50px;
  float:left;
}

＆＃13;

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">

<div class="container">
  <div id="bar">
    aaaa
  </div>
  <div id='everything'>   

    <div class='row'>
      <div class='col-sm-6'>
        <p>text long enough to make a paragraph</p>
        <p>text long enough to make a paragraph</p>
      </div>
      <div class='col-sm-6'>
        <p>text long enough to make a paragraph</p>
        <p>text long enough to make a paragraph</p>         
      </div>
    </div>

  </div>
  
</div>

＆＃13;

div内的col-sm，一边有边距

1 个答案: