开发者

IE7 missing element background image

开发者 https://www.devze.com 2023-03-23 13:37 出处:网络
I have a big problem to make my site comp. with older browsers. I use label+input text on many parts of my site. Somewhere IE7 did not show the background of the label.

I have a big problem to make my site comp. with older browsers.

I use label+input text on many parts of my site. Somewhere IE7 did not show the background of the label.

The css of the label for login:

label[for="login"] {
       -moz-border-radius:5px 0 0 5px;
      -moz-border-radius:5px 0 0 5px;
      -webkit-border-radius:5px 0 0 5px;
      background:url(moduletable_header_color.png) repeat-x left bottom;
      border-bottom:#b3aba4 1px solid;
      border-left:#b3aba4 1px solid;
      border-radius:5px 0 0 5px;
      border-right:#b3aba4 1px solid;
      border-top:#b3aba4 1px solid;
      color:#fff;
      display:block;
      float:left;
      font-family:'TitilliumText22LMedium';
      font-size:12px;
      font-weight:bold;
      height:25px;
      line-height:25px;
      margin:0;
      padding-bottom:0;
      padding-left:10px;
      padding-right:10px;
      padding-top:0;
      text-shadow:1px 1px 0 black;
      width:140px;

}

I use this same code an other page for an other label:

.formField label {
  -moz-border-radius:5px 0 0 5px;
  -webkit-border-radius:5px 0 0 5px;
  background:url(moduletable_header_color.png) repeat-x left bottom;
  border-bottom:#b3aba4 1px solid;
  border-left:#b3aba4 1px solid;
  border-radius:5px 0 0 5px;
  border-right:#b3aba4 1px solid;
  border-top:#b3aba4 1px solid;
  color:#fff;
  display:block;
  float:left;
  font-family:'TitilliumText22LMedium';
  font-size:12px;
  font-weight:bold;
  height:25px;
  line-height:25px;
  margin:0;
  padding-bottom:0;
  padding-left:10px;
  padding-right:10px;
  padding-top:0;
  text-shadow:1px 1px 0 black;
  width:140px;
}

And the 2nd is work we开发者_如何学Cll. The first work well on other browsers. What should be wrong? Im pullin out my hair..


I hope, IE7 won't support Attribute selectors (label[for="login"]). When I check with w3c it will work if we put doctype. Here is the example:-

http://www.w3schools.com/css/tryit.asp?filename=trycss_attselector_value

More details Here

http://www.w3schools.com/css/css_attribute_selectors.asp

Yes, it is not supporting [for="login"]


To make it work in IE7 and compliant browsers, use this selector:

label[for="login"], label[htmlFor="login"]

For details on this IE7 bug, see: http://reference.sitepoint.com/css/attributeselector#compatibilitysection


IE7 doesn't let you select labels with the 'for' attribute. Other attributes work, but trying to select an element either of these ways won't work:

label[for=test],
label[for] {
    /* THIS CODE WILL BE IGNORED */
}

You'll have to select the element another way, such as with an ID or a class instead.

IE7 also has problems using attributes for the selections of other elements. For example, trying to do table th[cellpadding=0] as a selector won't work either.

0

精彩评论

暂无评论...
验证码 换一张
取 消