Question

如何将此css应用于移动元素文本“DOG DOG DOG”以覆盖cat图像？

我在chrome中测试它没关系

http://image.ohozaa.com/i/g53/BwHNe9.png

但是在ie7元素文字DOG DOG DOG中没有移到顶部cat图片

http://image.ohozaa.com/i/53f/8OqTpZ.png

如何申请css？

<div style=" display: block;
opacity: 1;
color: rgb(255, 255, 255);
width: 80px;
height: 80px;
position: relative;
float: left;
background: #fff;
margin: 7px;">
<div style="
    left: 25px;  top: 13px;  z-index: 999;  opacity: 1;  -webkit-backface-visibility: hidden;  color: #fff;  font-weight: bold;  width: 117px;  text-align: center;  font-size: 12px;  font-family: lato;  padding: 10px 0px;  position: absolute;  margin: 0px;  background-color: rgb(0, 178, 45);  -moz-border-radius: 6px;  -webkit-border-radius: 6px;  border-radius: 6px ;
">
    DOG DOG DOG
</div>
<img src="http://green.uwex.edu/files/2010/06/4-H-Dog.png" width="80" height="80" style=" border: 1px solid rgb(203, 203, 203); ">            
</div>






<div style=" display: block;
opacity: 1;
color: rgb(255, 255, 255);
width: 80px;
height: 80px;
position: relative;
float: left;
background: #fff;
margin: 7px;">
<div style="
    left: 25px;  top: 13px;  z-index: 999;  opacity: 1;  -webkit-backface-visibility: hidden;  color: #fff;  font-weight: bold;  width: 117px;  text-align: center;  font-size: 12px;  font-family: lato;  padding: 10px 0px;  position: absolute;  margin: 0px;  background-color: rgb(0, 178, 45);  -moz-border-radius: 6px;  -webkit-border-radius: 6px;  border-radius: 6px;
">
    CAT CAT CAT
</div>
<img src="http://img1.wikia.nocookie.net/__cb20120908225005/disney/images/thumb/b/b6/Cheshirecatdisney.png/256px-Cheshirecatdisney.png" width="80" height="80" style=" border: 1px solid rgb(203, 203, 203); ">            
</div>

Answer 1

now check work fine in ie 7...  in body tag first div you change the css 


<div style=" display: block;
opacity: 1;
color: rgb(255, 255, 255);
width: 80px;
height: 80px;
position: relative;
*position: absolute; /* for ie 7 only */
float: left;
background: #fff;
margin: 7px;">

如何将这个css用于移动元素文本“狗狗狗狗”以超过“猫”图像？

1 个答案: