css - 水平样式嵌入的 Instagram 照片

Question

我很难为嵌入的 Instagram 照片添加简单的样式。我想要并排的照片，所以我使用了一个无序列表并设置了样式，这样它就不会被添加元素符号并水平列出。然而，这种风格似乎并不适用于嵌入的 Instagram 照片。

CSS

#instapost ul
{
list-style-type: none;
}

#instapost ul li { 
display: inline;
}

HTML

<div id="instapost">
<ul>
    <li>(copy any post from instagram and make max-width=320)</li>
    <li>(copy any post from instagram and make max-width=320)</li>
</ul>
</div>

可以在此处查看带有嵌入式 Instagram 照片的完整示例: https://jsfiddle.net/edwardgam/0k7smgvk/4/

(我实际上使用的是 WordPress 和一个 WordPress 插件“Simple Instagram Embed”，所以我只是复制 Instagram 照片的 URL(而不是 Instagram 提供的嵌入代码)并粘贴到我的 Wordpress 帖子中的适当位置。但是，无论我是否使用该插件，这个问题都存在)。

谢谢。

Answer 1

#instapost ul li { 
    width: 320px;
    float: left;
    margin-right: 10px;
}