Zurb foundation 在基础图像上覆盖文本 我有以下的基础规范：

代码：

$（文档）.ready（函数（）{
$（document.foundation（）；
});
身体{
背景色：#a3d5d3；
}
#包裹{
位置：relative；/*使该相对值具有内部div绝对值而不会中断*/
/*宽度：200px；/*固定宽度，否则将是整个页面的宽度*/
背景：银；
边框：1px纯灰
}
#正文{
颜色：#ffffff；
左缘：70%；
位置：绝对位置；
宽度：250px；
身高：60%；
排名：0；
底部：0；
背景：黑色；
不透明度：0.5；
填充：20px；
}






MCA编码和MLC合规性

这是我需要在右边显示的一些文本。这是我需要在右边显示的一些文本。这是我需要在右边显示的一些文本。这是我需要在右边显示的一些文本。

在大屏幕上，它工作正常——我希望图像上的文本过度显示在右边——但是如果你缩小屏幕，文本开始从右边消失——有人知道如何在所有屏幕上保持一致吗？？？

---

谢谢

最好使用left:position来定位，而不是边距。您可能还希望删除“高度”属性，以便它容纳更多内容

#text {
   padding-top: 2em; /*replaces the <br>s in your html*/
   color: #ffffff;
   position: absolute;
   width: 250px;
  /*height: 60%;*/
  top: 0;
  right:7.5%; /* instead of margin*/
  background: black;
  opacity: 0.5;
  padding: 20px;
}

#文本{
填充顶部：2em；/*替换html中的
s*/
颜色：#ffffff；
位置：绝对位置；
宽度：250px；
/*身高：60%*/
排名：0；
右：7.5%；/*而不是保证金*/
背景：黑色；
不透明度：0.5；
填充：20px；
}

我制作了一个代码笔演示：

#text {
   padding-top: 2em; /*replaces the <br>s in your html*/
   color: #ffffff;
   position: absolute;
   width: 250px;
  /*height: 60%;*/
  top: 0;
  right:7.5%; /* instead of margin*/
  background: black;
  opacity: 0.5;
  padding: 20px;
}