如何将两个div并排放置,第二个宽度是100%? [英] How to position two divs side by side where the second width is 100%?

查看:314
本文介绍了如何将两个div并排放置,第二个宽度是100%?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我想实现这个:

width=60px         width = remaining space
|------|    |-----------------------------------|
| div1 |    | Loren ipsun...                    |
|------|    |                                   |
            |                            div2   |
            |-----------------------------------|




jsFiddle上的示例html。

Sample html on jsFiddle.

推荐答案

只需浮动第一个div,然后设置margin-left的第二个div来容纳第一个div的宽度。像这样:

Just float the first div, and set the margin-left of the second div to accommodate the width of the first div. Something like this:

div.one {
  width: 60px;
  float: left;
}

div.two {
  margin-left: 60px;
}

请记住 width div属性的div只适用于内容,所以你需要设置 margin-left width border margin padding 第一个div的属性。

Keep in mind that the width CSS property on the div only applies to the content, so you need to set the margin-left to be the sum of the width, border, margin, and padding properties of the first div.

这里是更新的版本的你的jsfiddle。如果您对此有任何疑问,请与我们联系。

Here is the updated version of your jsfiddle. Let me know if you have any questions about it.

这篇关于如何将两个div并排放置,第二个宽度是100%?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆