HTML5数据展示问题

Question

 

 

 

 

如图所示，DIV中固定一个DIV,剩余空间展示数据，有新的数据在最前面追加一个，后面所有的数据向后移动一下，这种不规则的数据展示如何实现？

Answer 1

我是想做到数据的动态展示 不是做静态页面，这样的话，div没法向后移动一个吧

Answer 2

回复
@韩宇栋 : 变的是展示的内容，应该不是DIV，因为你的内容应该中间不会有空缺位置

Answer 3

<div class='main-container'>
  <div class='big-row'>
    <div class='big-column'>固定DIV</div>
    <div class='small-column'>
      <div class='icon'>1</div>
      <div class='icon'>3</div>
    </div>
    <div class='small-column'>
      <div class='icon'>2</div>
      <div class='icon'>4</div>
    </div>
  </div>
  <div class='small-row'>
    <div class='small-column'>5</div>
    <div class='small-column'>6</div>
    <div class='small-column'>7</div>
    <div class='small-column'>8</div>
  </div>
</div>

CSS部分：

.big-row的高度设置为较大的值，.small-row设置为较小的值，big-icon 宽度占满50%宽度，其他的调试一下。

Answer 4

float? 固定的div向左浮动，其他的元素作为行内元素？我猜的，可能不对