doutuosai3504
2017-12-19 09:26
浏览 24
已采纳

在CSS中为RSS提供样式

I have the following RSS feed:

https://jsfiddle.net/yhtf36a1/

Right now, it gets displayed one below the other.

How do I use CSS to make it display two items per row, so that it looks like the following? enter image description here

I tried using display:inline-block but that didn't work.

图片转代码服务由CSDN问答提供 功能建议

我有以下RSS提要:

https://jsfiddle.net/yhtf36a1/

现在,它会在下面显示一个 另一个。

如何使用CSS使其每行显示两个项目,以便它看起来如下所示?

我尝试使用 display:inline-block 但是没有用。 \ n

  • 点赞
  • 写回答
  • 关注问题
  • 收藏
  • 邀请回答

2条回答 默认 最新

  • doufan6886 2017-12-19 10:16
    已采纳

    Hope this helps

    *{font-family:arial}
    .rssRow{display:flex}
    .entry-wrapper{display:inline-block; margin:.25em;background:#f3f3f3; border:3px solid #f1f1f1; background:#FFF;padding:10px;border-radius:5px;}
    .entry-wrapper:hover{background:#edfdff;border:3px solid #f4f4f4}
    .entry-image{float:left;}
    .entry-text{float:left;}
    .entry-title h4{margin:0; font-size:1.5em;font-weight:bold;}
    .entry-title h4 a {color:#333; text-decoration:none;}
    .entry-title h4 a:hover{text-decoration:underline;}
    .entry-date{color:#999; padding-bottom:.75em;font-size:.75em}
    

    Preview at https://jsfiddle.net/itsselvam/yhtf36a1/3/

    Let me know for any query on this

    点赞 打赏 评论
  • dongtiaozhou4914 2017-12-19 09:32

    Use the following CSS:

    .entry-wrapper {
      float:left;
      width: 48%;
      background: lightblue;
      margin: 1%
    }
    

    See the example here: jsfiddle.net/GillesCoeman/5e8z00z1

    点赞 打赏 评论

相关推荐 更多相似问题