根据内容

Question

我想尝试以下场景：作为容器的部分，以及不同的div内部。这些是动态创建的。我正在解析一个JSON文件，对于我找到的每个人的名字，我必须创建一个div，其中包含该人的图片和图片下方的名称。所以我的div包含一张图片和一个字符串。我想要做的是将这些div放在连续的部分/容器中。不幸的是我到目前为止还没能到它而且div是垂直显示而不是水平显示。实际上，我注意到每个div在空间方面占据整行。因此，我想知道什么是一种智能的方式来调整div的方式，这样可以占用足够的空间来包含图片和文本。我不想明确使用像素数，因为我发现它设计不好。有帮助吗？我可以尝试输入一些代码，但我使用敲除来绑定所有信息。

<section id="picturesSection">
    <div data-bind="foreach: { data: people, as: 'person'}">
        <header>
            <img width="256" height="256" data-bind="attr:{src: person.imageUrl}">
        </header>
        <footer>
            <p class="nameEmployeePos" data-bind="text: person.name"></p>
            <p class="nameEmployeePos" data-bind="text: person.dateOfBirth"></p>
        </footer>
    </div>
</section>

Answer 1

你可以添加＆＃34; float：left＆＃34;你的div风格。在这种情况下，宽度将采取与内容相同的宽度。但是，如果您的内容太长，它也可能占用整个页面。在这种情况下，您可以设置百分比的百分比，例如，＆＃34;宽度：20％＆＃34;连续五个街区。