【问题标题】:full width div by small description text css responsive全宽 div 由小描述文本 css 响应
【发布时间】:2014-05-28 10:02:36
【问题描述】:

我喜欢为我的文本 div 设置宽度:100%。但我不知道为什么这不起作用。

所以,如果我的描述文本很小,我的列表 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>

【问题讨论】:

  • 你能分享你的css吗
  • @fidelcastro 我发布了我的演示站点,您可以在 firebug 或谷歌开发者工具上对其进行测试。 CSS 代码太多了^^
  • 好的,戴夫我找到了解决方案,你检查一下

标签: css text responsive-design width


【解决方案1】:

在你的班级中添加“width:100%”(event_list_abstand)。

【讨论】:

  • 我更新了我的问题。希望你能更好地理解我的问题:)
  • 如果我有长描述文本和小描述文本,我需要这种格式。
【解决方案2】:

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

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

【讨论】:

  • 感谢您的回答。我更新我的问题。希望你能更好地理解我的问题:)
【解决方案3】:
columns {
    -moz-box-sizing: border-box;
    width: 100%;
}

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

【讨论】:

  • 感谢您的回答。我更新我的问题。希望你能更好地理解我的问题:)
【解决方案4】:

将此添加到您的 css 中

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

【讨论】:

  • 谢谢你的小费。但我需要这个:如果在宽度为 100% 的 div 中有小差异文本

    blubblub

猜你喜欢
  • 1970-01-01
  • 2018-07-27
  • 2019-12-11
  • 2013-06-15
  • 2018-12-26
  • 2016-01-19
  • 1970-01-01
  • 1970-01-01
  • 2013-03-27
相关资源
最近更新 更多