3

We are working on a new website and are having an issue with the "Join the Conversation" box in Safari only. Works fine on other browsers. The background is only suppose to appear on the bottom of the box, but in Safari, it displays on the entire box: http://futurethink.colorandinformationdev.com

The old dev site is here, and it displays fine on Safari and other browsers. I did a diff check between the home page and css, but can't figure this one out: http://cool-quotes.org/future

#email_newsletter.home_content {
   background:#fff url(img/addons/news_letter_container_bg.png) repeat-x left bottom;
   overflow: hidden !important;
   border:1px solid #B3B3B3;
   /* */ 
}
4

2 回答 2

1

根据W3Schools，您可以提供以下格式的值：

  • 右上/右中/右下：只指定一个关键字
  • xpos ypos : 单位可以是像素 (0px 0px) 或任何其他CSS 单位
  • inherit ：指定 background-position 属性的设置应该从父元素继承

我也亲自尝试过你的东西，我发现它真的不适用于 Safari，但如果你真的有必要，并且如果你可以做下面提到的技巧，那么你的问题就解决了 :-)

为你工作的小提琴

<!-- The CSS -->
<style type="text/css">
div {
background: url(https://www.google.co.in/images/srpr/logo4w.png) no-repeat scroll right bottom transparent;
margin-right: 100px;
}
p {
margin-right: -100px;
}
</style>

<!-- The HTML -->
<div>
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. In euismod adipiscing elementum. In turpis ipsum, adipiscing vitae magna vitae, consequat hendrerit justo. Aliquam non facilisis dui, tempus convallis tortor. Donec ultricies pharetra tortor, a tempor magna commodo nec. Donec id justo ornare, ullamcorper est ac, aliquet justo. Duis rutrum justo a laoreet volutpat. Phasellus molestie consequat risus at varius. Aenean imperdiet ornare odio, a aliquam leo pharetra id. Integer lectus felis, semper id sapien viverra, dignissim molestie massa. Mauris blandit eros eget lorem cursus, sed consectetur lectus tincidunt. Cras tristique vel orci eu cursus. Sed congue tempor venenatis. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Maecenas vehicula nec eros sit amet mollis. Nam ipsum arcu, pretium et tempus ac, scelerisque sed nulla. Sed dapibus in massa in consequat.</p>
</div>

干杯和好运！

于 2013-07-28T14:55:13.570 回答
0

尝试这个 ！

#email_newsletter .home_content {
   background: #ffffff url('img/addons/news_letter_container_bg.png') left bottom repeat-x;
   width: 600px;
   height: 400px;
   float: left;
   overflow: hidden !important;
   border:1px solid #B3B3B3;
   /* */ 
  }
于 2013-08-02T08:52:42.367 回答