相关疑难解决方法(0)

我使用svg图像作为背景.我正在尝试使用CSS3,background-size: 100% 100%;但它似乎不起作用,即使在应该支持它的浏览器中(如Chrome).

如果你看这个网站,你会看到#special-post article(在食物图像的右下方)有一个红色的横幅背景.请注意,当您向下缩小窗口时,背景图像的高度会下降以保留其比例,而不是按照我的意愿拉伸.

编辑:我在FireFox上检查了它,它工作正常...所以这似乎是一个webkit问题.

编辑:我在Safari上检查了它,它的工作原理!所以看起来我的问题是针对Chrome的.

(PS:我熟悉这种替代解决方案,使用img标签,但我宁愿不使用它.)

我使用svg图像作为背景,我通过背景大小拉伸SVG图像.我希望它只是宽度明智的拉伸.它在firefox,IE9 +但Chrome中工作得非常好.请建议我如何实现它.

.homecallouts ul li {
background-image: url('blue_arow_callout.svg');
background-size: 100% 100%;
width: 21%;
height: 42px;

请参阅jsbin代码 http://jsbin.com/uvijuc/4/

当我在firefox中调整大小只有宽度拉伸但在chrome中宽度和高度都拉伸.我只希望宽度伸展.