[分享]css两个盒子能放一起吗

在使用CSS布局的过程中，我们常常会遇到这样的问题：两个盒子能否放在一起呢？

  .box1{
        width:50%;
        float:left;
      }

    .box2{
        width:50%;
        float:right;
      } 

通过上述代码，我们可以将两个盒子放在同一行中。box1盒子占据页面的左半部分，box2盒子占据页面的右半部分。由于两个盒子的宽度之和为100%，因此它们能够并排放置。

另外一种常见的方式是使用display:inline-block属性。通过这种方式，我们可以将两个盒子放在同一行中，同时保留它们的盒子特性，如宽度、高度等。

  .box1{
        width:50%;
        display:inline-block;
      }

    .box2{
        width:50%;
        display:inline-block;
      } 

需要注意的是，使用display:inline-block属性时，需要在两个盒子之间对空格进行处理，否则它们之间会产生一定的间隙。

总的来说，只要我们合理利用CSS属性，两个盒子是完全可以放在一起的。无论是使用float属性还是display:inline-block属性，都能够得到不错的效果。