CSS:div中元素的动态宽度

克里斯蒂安·拉夫特塞斯(Kristian Rafteseth)

我如何才能使floating-text下面div具有动态宽度,以便它填充图像旁边的空间?图片的宽度可以从100像素到400像素。

<div id="container">
  <img src="image-can-be-from-100-to-400px-wide.jpg">
  <div id="floating-text">
    Text to be floated:left on right side of the image.
    The width of this div needs to be dynamic, 
    so it will fill out the open space on the right side of the image above.
  </div>
</div>

CSS:

#container {
  width: 700px;
  padding: 20px;
}
#floating-text {
  margin-left: 20px;
  float: left;
}

小提琴:http : //jsfiddle.net/51zstw6b/

前卫的

给图像一个浮点数:向左移并删除浮点文本的浮点数。

的CSS

#container {
  width: 500px; /*width adjusted for this fiddle demo*/
  padding: 20px;
}

.img {
    width: 200px;
    float: left;
    margin-right: 5px;
}

#floating-text {
  margin-left: 20px;
}

见小提琴

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

CSS:div中元素的动态宽度

来自分类Dev

当div有宽度时,如何使用flexbox居中元素?

来自分类Dev

CSS:居中元素具有内联的绝对宽度/高度

来自分类Dev

固定宽度div内div元素的动态宽度

来自分类Dev

修复UIStackView中元素的宽度

来自分类Dev

宽度未知的居中元素

来自分类Dev

CSS :: before :: after伪元素动态宽度

来自分类常见问题

动态宽度居中固定div(CSS)

来自分类Dev

父div的CSS动态图像宽度

来自分类Dev

使用jQuery显示Div中其他三个元素中元素的最大宽度

来自分类Dev

按钮和div元素的CSS宽度不同

来自分类Dev

CSS-动态填充以扩展div以填充动态宽度

来自分类Dev

如何更改Visio形状中元素的宽度

来自分类Dev

CSS:如何将div以动态宽度放置在中心

来自分类Dev

在行内动态居中元素

来自分类Dev

HTML / CSS-右下角对齐的固定宽度div旁边的动态宽度div

来自分类Dev

HTML / CSS-右下角对齐的固定宽度div旁边的动态宽度div

来自分类Dev

动态宽度-CSS

来自分类Dev

动态CSS宽度

来自分类Dev

动态CSS宽度

来自分类Dev

标题元素动态宽度上的溢出-显示:包含的容器div上的块和最小高度/宽度

来自分类Dev

CSS根据内部元素获取溢出div容器的最大宽度

来自分类Dev

DIV和TEXTAREA元素对“宽度” CSS属性的解释不同吗?

来自分类Dev

列表元素的动态宽度计算

来自分类Dev

div中的水平居中元素

来自分类Dev

更改嵌套div中元素的样式

来自分类Dev

我们何时知道Angular中元素的实际宽度?

来自分类Dev

我们何时知道Angular中元素的实际宽度?

来自分类Dev

CSS垂直居中元素无法换行