CSS跨文本覆盖图像问题

-3

我已经上传了一个图像，但无法正确定位日期框。正如你所看到的，还有一个日期框在最右边。我认为很多问题是由于position: absolute，但如果有办法让它保持在div中，这将是很好的。任何帮助，将不胜感激。CSS跨文本覆盖图像问题

编辑：这是代码。

.event-picture-block { display: inline;} 
.event-date-box { position: absolute; margin-top: 300px; margin-left: 2.4%; background-color: white; color: black; font-size: 35px; width: 10%; text-align: center; } 
.event-image { width: 33.1%; } 

<div class="container"> 
<% @events.each do |event| %> 
<div class="event-picture-block"> 
    <span class="event-date-box"> 
    <%= event.date.strftime("%^b %e") %> 
    </span> 
    <%= link_to event_path(event), class:"link-margin" do %> 
    <%= image_tag(event.image.url(:small), :class =>"event-image") %> 
    <% end %> 
</div> 
<% end %> 
</div>

谢谢！

来源

2017-02-16 Brian Lau

请粘贴一些代码或制作一个jsfiddle –

您的代码和输出的图像几乎毫无价值。请复制+粘贴相关代码到问题中。 –

很抱歉，我们无法单独为您提供图片帮助。请张贴您的HTML和CSS片段。 – Gezzasa

尝试添加位置：相对于画面块：

.event-picture-block { display: inline;position:relative;}

，并更改其余的CSS属性按您的要求。

来源

2017-02-16 10:38:19

我这样做了，但日期文本框仍然在顶行的屏幕上熄灭。编辑：原来我有一个保证金 - 右：-3px;谢谢。我可能需要删除由于我的downvotes。 –

CSS跨文本覆盖图像问题

回答

相关问题