html - Wordpress 22 为图像添加额外的边距

Question

我已将这三张图片添加到 WP 站点。代码是:

<style> 
    #frontContainer { 
        max-width: 1200px; 
    }

    #frontContainer ul { 
        list-style: none;
    }

    #frontContainer li { 
        height: 599px; 
        width: 376px; 
        float: left; 
        margin-right: 5px;    
        border: 2px solid black;  
        opacity: 1; 
    }

    #frontContainer img { 
        height: 100%; 
        width: 100%;  

    } 

    #frontContainer li:hover{ 
        border: 2px solid #47B957; 
        opacity: .5;
     }

 </style>

 <div id='frontContainer'>
        <ul>
            <li><a href='http://pacificexpress.com.au/?p=975'><img src='http://i59.tinypic.com/2gt6fsp.jpg'/></a></li>
            <li><a href='http://pacificexpress.com.au/rapid-worker/'><img src='http://i61.tinypic.com/34pifd2.jpg'/></a></li>
            <li><a href='http://pacificexpress.com.au/?p=971'><img src='http://i58.tinypic.com/348ohhg.jpg'/></a></li>
            </ul>
        </div>

这在测试时有效(即三张图片排成一排，每张图片之间有 5 像素的边距)但是一旦我将它添加到网站(运行 22 个主题的 wordpress 平台)它似乎增加了边距。

我似乎无法改变这一点……有人可以帮忙吗？

网站是 www.pacificexpress.com.au

干杯

詹姆斯·M。

Answer 1

额外的边距来自 .entry-content li 中指定的左边距选择器，要摆脱它，您只需要覆盖 <li> 上的边距s 为 0px。

#frontContainer li {
    height: 599px;
    width: 376px;
    float: left;
    margin-right: 5px;
    margin-left: 0px;  /*or whatever other value you want*/
    border: 2px solid black;
    opacity: 1;
}