Question

<div id="wrapper">
    <div id="header">

    </div>
    <div id="content">
        <div id="canvas">

        <div>
        <div id="chat">

        </div>
    </div>
</div>

这里有很多问题，但它总是以绝对px宽度解决。有没有办法将这两个div放在一起？我不想给出特定的宽度，因为我希望它在不同的屏幕上看起来很好。

编辑：

{{1}}

Answer 1

只需添加此css规则：

'files' => storage_path('framework/sessions')

另一种方法是将属性显示import com.sleepingdumpling.jvideoinput.Device; import com.sleepingdumpling.jvideoinput.VideoFrame; import com.sleepingdumpling.jvideoinput.VideoInput; Device choosenDevice; for (Device device : VideoInput.getVideoDevices()) { // select your choosenDevice webcam here if (isMyWebcam(device)) { choosenDevice = device; break; } } // eg. VideoInput(640,480,25,choosenDevice ); VideoInput videoInput = new VideoInput(frameWidth, frameHeigth, frameRate, choosenDevice ); VideoFrame vf = null; while (grabFrames) { vf = videoInput.getNextFrame(vf); if (vf != null) { frameReceived(vf.getRawData()); // or vf.getBufferedImage(); } } videoInput.stopSession();设置为#content > div { float: left; }个孩子，如下所示：

inline-block

答案仍然正确。你的html中有拼写错误，你没有正确关闭#content div。您已将#content > div { display: inline-block; }改为canvas。

试试here

Answer 2

您可以使用内联样式或浮动。

#wrapper {
  width: 100%;
}

#canvas,
#chat {
    display: inline-block;
    vertical-align: top;
}
#canvas {
  height: 300px;
  border: 1px solid black;
}

#chat {
  height: 300px;
  border: 1px solid black;
}

Answer 3

如果你想要超过2个div。只需指定width属性和float：left;

HTML

<div class="outer">
 <div class="inner">Left</div>
 <div class="inner">Middle</div>
 <div class="inner">Right</div>
</div>

CSS

.outer {
    width: 600px; /*width of outer box */
}

.inner {
    float: left; width: 100px; /* Width of each box */
}

DEMO http://jsfiddle.net/_pirateX/yxL3fg16/

Answer 4

我认为没有必要考虑宽度，如果使用bootstrap类，则不需要声明许多css。例如：

＆＃13;

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet" />
<div class="container-fluid">
  <div class="row">
    <div class="col-sm-6 col-md-6">
      <div style="background-color:#0e0e0e;">column-1</div>
    </div>
    <div class="col-sm-6 col-md-6">
      <div style="background-color:#ff0000;">column-2</div>
    </div>
  </div>
</div>

＆＃13;

这是你的意思吗？

CSS放置两个相对宽度相邻的div

4 个答案: