Можно ли отобразить границу родительского диапазона перед дочерним диапазоном в ie7? - PullRequest
Новая
       13

Можно ли отобразить границу родительского диапазона перед дочерним диапазоном в ie7?

1 голос
/ 03 января 2011

Я бы хотел, чтобы тень шла за текстом.Кто-нибудь видит, что я делаю не так?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" >

<style>
.tooltip{
background-color: #ffffe1;
position: absolute;
border-style:solid;
border-width: thin;
border-color: #000000;
z-index: 25;
}

.tooltip_shadow{
background-color: #dadbda;
position: absolute;
width: 100%;
height: 100%;
left: 5px;
top:5px;
z-index: -1;
}
</style>

<SPAN style="TOP: 86px; LEFT: 39px" class=tooltip>
    <SPAN style="Z-INDEX: 15">This is a message!</SPAN>
    <SPAN class=tooltip_shadow>
    </SPAN>
</SPAN>

Спасибо, Грей

1 Ответ

0 голосов
/ 03 января 2011

Я не знаю, что вы на самом деле пытаетесь достичь с помощью тени, но я знаю, что этот фрагмент HTML содержит много синтаксических ошибок.После стандартизации я просто получаю div под div, поэтому он имеет серый фон.Что вы пытаетесь достичь?

Это то, что вы ищете? 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
<style type="text/css">
    .tooltip{
        position: absolute;
    }

    .tooltip_shadow{
        background-color: green;
        position: absolute;
        width: 100%;
        height: 100%;
        left: 5px;
        top: 5px;
    }

    .tooltip_content
    {
        background-color:red;
        position:relative;
        border-style:solid;
        border-width: thin;
        border-color: #000000;
    }
</style>

</head>

<body>
    <div style="top: 86px; left: 39px;" id="wvTooltipdiv_1" class="tooltip">
        <div class="tooltip_shadow"></div>
        <div class="tooltip_content">This is a message!</div>
    </div>
</body>
</html>
...