javascript - CSS : Div placement in column

Question

我在放置一些 div 时遇到问题。我有以下结构:

<div class='box'>
  <div class='boxTitle'><span class='name_field'>my_first_field</span></div>
  <div class= 'boxContent'><div class='JSDIV'>my_first_content</div></div> 
  <div class='boxBottom'></div>
</div>

<div class='box'>
  <div class='boxTitle'><span class='name_field'>my_second_field</span></div>
  <div class= 'boxContent'>
    <div class='JSDIV'>
      <span id='id_field_toJS'></span>
    </div>
  </div>
</div>

<div class='boxBottom'>  .</div>
</div>

JSDIV 类允许我在此字段上执行一些 javascript。 boxTitle、box Content 和 boxBottom 允许我使用一个框架，在这些上设置一些漂亮的 css，并从“box”div 类中获得一些非常好的东西。但问题是:-div 类“boxBottom”必须有一个要显示的字符，如果我让一个空格消失。这是可悲的，因为它显示了盒子的底部，没有它，盒子似乎被切割了。-我不知道如何用每个“盒子”制作两列或三列。当我尝试“.box{ display :inline}”时，每个 div 都设置得很糟糕。一些图片将有助于理解。

这是一个普通的盒子，当 div“boxBottom”为空时遵循相同的弓形(目前我添加了一个点“.”以用一个字符填充它):!

http://i.stack.imgur.com/LtbYV.png

http://i.stack.imgur.com/LtbYV.png

现在，我期望的处置:i.stack.imgur.com/szWfT.png

当我设置 .box{display :inline;} 时我得到了什么(只在一个盒子上，所有其他盒子都做同样的问题)i.stack.imgur.com/B3nRX.png

我认识到由于使用了框架，我的问题并不是很简单，但这里它可能只适用于必须放置在两列或三列中的 div。我希望 jQuery 能做到这一点，但我没有找到任何处理所有 div 的函数。

感谢您阅读我的内容!! (抱歉，我没有足够的声誉来正确发布图片，所以我使用了另一种方式来做到这一点。只需在链接前添加“https://”即可查看。

雨果。

Answer 1

为了在 contentBottom div 中设置一个不间断空格 ( ) 或使用 css 属性 min 指定最小高度-高度