全宽div由小描述文本css响应

Question

我喜欢宽度：100％为我的文本div。但我不知道为什么这不起作用。

所以，如果我有小的描述文字，我的列表div没有全宽，如果我有长描述文字，所以我有100％宽度div。

这是我的愚蠢问题：

DEMO SITE

这是我的HTML：

<div class="columns events_list_even margin_padding_clean">
                            <div class="event_list_abstand">
                            <div class="two columns padding_right_left_clean">
                            <div class="date-list"><i class="fa fa-calendar fa-lg" style="margin-right: 10px"></i>Mo. 14.04.2014 </div>
                    <img src="http://www.davis-design.de/marktadresse/files/floh_troedel_jahrmarkt.png" class="category_icon">
                    <img src="http://www.davis-design.de/marktadresse/layout/images/veranstaltung_halbwegs_ueberdachung.png" class="roof">
                     </div>
                     <div class="ten columns margin_bottom_clean padding_right_left_clean">
                     <a href="/marktadresse/niedersachsen.html?veranstaltung=Abendmarkt+Osnabrueck%7E1X4JxCOwhDpD4Oj5ch%7E14.04.2014"><h2 class="date-ueberschrift" style="border-bottom: none;">Abendmarkt Osnabrueck</h2></a>
                     <div class="date-info"> Albrechtstraße 15 | 49076 Osnabrück |
                       Floh-, Trödel- &amp; Jahrmarkt</div>
                      <p class="margin_bottom_clean">Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam ...</p></div></div></div>

Answer 1

添加＆＃34;宽度：100％＆＃34;在你的班级（event_list_abstand）。

Answer 2

将此添加到您的css

div.columns.events_list_even.margin_padding_clean {
width: 100%;
}

Answer 3

columns {
    -moz-box-sizing: border-box;
    width: 100%;
}

在第5行的responsive.css中进行上述更改，以获得全宽的div

Answer 4

根据您的CSS，要仅定位白色和灰色框，请尝试：

.loop-posts .events_list_even{
   width:100%;
}