Hi,
I want to display tool tip. Below is my code.
.help_msg_cont{
position:relative;
z-index:1000;
}
.tooltip{
width:25em;
padding:.5em 1em;
background:#f5f8fd;
border:1px solid #b1c8d6;
position:absolute;
top:-25px;
left:2em;
z-index:1001;
}
<div class="help_msg_cont">
<input type="radio" name="codeType" value="advanced" id="codeAdv" /><label>Advanced</label><span class="info"></span>
<div class="tooltip curve_border"><span class="arrow"></span>
<strong>Note</strong>
<ul>
<li>Simple to implement, just copy and paste</li>
<li>One ad per page.</li>
</ul>
</div>
</div>
<div class="help_msg_cont">
<input type="radio" name="codeType" value="advanced" id="codeAdv" /><label>Advanced</label><span class="info"></span>
<div class="tooltip curve_border"><span class="arrow"></span>
<strong>Note</strong>
<ul>
<li>Simple to implement, just copy and paste1</li>
<li>One ad per page2.</li>
</ul>
</div>
</div>
Problem is since in IE relatively position div will have higher z-index value compared to absolutely positioned div(even though in css i mentioned z-index), A.P. div is overlapping with adjacent R.P. div .
Link for Screem shot:screen shot
